# 5、编译小程序和H5
## 编译小程序
通过 `HBuilder X` 打开源码的 `web` 文件,打开 `manifest.json` 找到小程序配置
![](https://img.kancloud.cn/22/a7/22a73ebce49682e2132f128880f70628_2039x1124.png)
填入你的小程序的APPID。
![](https://img.kancloud.cn/7e/b5/7eb585ebba98d0b43e9d2aa58871d3ee_2336x1355.png)
以及您的 uni-app的 APPID
找到 `config/app.js` 填写你的 系统域名,即上面部署的域名
![](https://img.kancloud.cn/e2/21/e221255c58d5acac76a5e2aa13d439a6_2301x1392.png)
编译前,在项目的目录上`右键 --> 重新识别项目类型`。
![](https://img.kancloud.cn/23/e6/23e693695e4af88942fe8a1135b6efd2_660x1059.png)
点击 `发行 --> 小程序-微信`
![](https://img.kancloud.cn/f0/2c/f02c336402d96e4c2263ee141bacafa0_567x816.png)
填写对应的信息,即可发布了,编译发布了
![](https://img.kancloud.cn/fc/b3/fcb3e161fdee851c17e107a9970ab27d_1851x954.png)
编译完成后,会打开开发者工具。如果未打开,也可以自己打开开发者工具,并找到编译后的源码。打开`web\unpackage\dist\build\mp-weixin`,点击上传,即可上传到小程序平台。
![](https://img.kancloud.cn/db/0a/db0a75908c9ee8ccec4229123fcea2b5_1870x1483.png)
接下来登陆微信小程序平台,提交审核即可
![](https://img.kancloud.cn/d3/e7/d3e7e778dbc3506eb25c36ef7f177f5e_3205x1751.png)
### 编译h5
配置的接口地址 `config/app.js` 和上面一致。点击 `发行-->网站-PC Web`
![](https://img.kancloud.cn/e4/59/e45937423461fda40a6806d29553317e_494x837.png)
编译后的地址在 `web\unpackage\dist\build\h5`
![](https://img.kancloud.cn/b4/77/b477663d5d33af6a117b764e491bf89e_1027x142.png)
将这些文件放到一个静态的h5域名指向的网站就可以了,比如 宝塔上新建一个静态站点 `h5.sparkshop.cn`,把编译后的 static 和 index.html 上传上去,就可以了