🔥码云GVP开源项目 12k star Uniapp+ElementUI 功能强大 支持多语言、二开方便! 广告
## 微信小程序端编译上传 在编译之前首先要给uniapp安装依赖(命令行执行npm install)如下图: ### **源码在本地的安装依赖** 打开源码所在目录,将路径打开到uniapp下:如图: ![](https://img.kancloud.cn/0c/df/0cdf8cefb0db2bc2a608c07d42f8aef7_1242x723.png) ![](https://img.kancloud.cn/26/32/2632bac050330d339058fa9b6165eeb9_1240x772.png) ![](https://img.kancloud.cn/78/3d/783dc3b0c183d8eb1d0d07e9defd9d18_1244x821.png) 安装完依赖之后,会看到在uniapp文件夹下会生成一个node_modules文件夹。如图: ![](https://img.kancloud.cn/a3/f6/a3f691f2de579c6d45acc7cdfaba79db_1234x726.png) ### **源码在宝塔时安装依赖** 如果源码在宝塔时,和在本地一样找到源码站点的uniapp所在目录,如图: ![](https://img.kancloud.cn/2b/1f/2b1f390d4502680470c6ff702b491bee_1877x867.png) 打开终端,执行 npm install 进行安装依赖,如图: ![](https://img.kancloud.cn/a3/c6/a3c6afb5ede58cb660832302d3dec046_1354x804.png) ![](https://img.kancloud.cn/30/bb/30bb4f41d1de4d7947d710919909fa60_1677x831.png) 依赖完成后,同样在uniapp目录下会看到生成一个node_modules文件夹,如图: ![](https://img.kancloud.cn/b3/06/b306729933447608439eea5a55267830_1888x794.png) 如上操作依赖安装完成,接下来就要将uniapp源码包导入开发者工具中进行编译上传了,步骤如下: 一、将uniapp源码包导入到Hbuilder工具中。 ### **这里一定要注意导入的uniapp源码包的路径,很多开发者在这里极容易出错,导入的uniapp源码包不全或者位置错误。** ![](https://img.kancloud.cn/13/40/13405c146459e1ae7e9269144a4efe1d_1244x631.png) 二、填写配置文件。 **这里需要说明:在uniapp源码根目录有两个配置文件,.env.development 文件和.env.production文件,这里又必要讲解一下。 .env.development 配置文件是用于本地开发过程中进行实时观看效果,也就是小程序或者h5运行的时候填写; .env.production 配置文件是需要发行到线上的时候填写;** ![](https://img.kancloud.cn/55/ba/55ba8eb708c841145ea95e8d0116cf3d_1059x750.png) 三、填写完成后,点击发行-小程序微信 ![](https://img.kancloud.cn/71/26/712635b58462519545f869fd12fc6ed0_1486x808.png) 四、填写小程序appid,点击发行。 ![](https://img.kancloud.cn/0f/8f/0f8f1dd3f898e99d9cdcd2741a1e2ff0_1556x681.png) 五、编译完成后,在uniapp/dist/build下会生成编译文件夹mp_weixin。 ![](https://img.kancloud.cn/26/42/26422621818dc8c5e9f2bff764fb2605_1481x914.png) 六、编译完成后,会自动将项目在微信开发者工具中打开,如果没有打开,需要手动导入编译包。 ![](https://img.kancloud.cn/39/f3/39f3a0fb12800b6bc62a129d03c5918e_1242x984.png) 七、点击开发者工具右上角的上传,即可将小程序发布线上审核,上传完成后,登录小程序开发者平台,将提交的项目点击审核,审核通过后,再通过小程序开发者平布点击发布,这样小程序就上线了。 ![](https://img.kancloud.cn/32/9e/329e021eed5fdb6cd0f06835fdc02c7e_1250x973.png) ## **在微信开发者中上传微信小程序时,登录的微信账号必须是该小程序的开发者,否则是没有权限上传的**