多应用+插件架构,代码干净,二开方便,首家独创一键云编译技术,文档视频完善,免费商用码云13.8K 广告
# 部署 H5 文档最后更新时间:2021-06-17 15:52:19 ### 开始之前 * 强烈建议不喜欢折腾的同学给`H5`前端单独部署一个站点,配置好域名,并且强烈建议配置好`https` * 生成海报前,请先把 后台 -》 商城配置 -》商城信息-》分享设置,配置正确 ### 后端 #### 创建站点,并且配置好 https ![](https://img.kancloud.cn/10/9b/109b7bb1b48202d2c7d69f768db86bee_636x503.png) #### 前端的伪静态(使用history模式) ![](https://img.kancloud.cn/33/f9/33f980d7d5f40be04cec1489a0a027fc_686x254.png) #### Nginx配置 ~~~ location / { try_files $uri $uri/ /index.html last; index index.html; } ~~~ **重启 Nginx!!!** sSwNyTon0WkYd/tn6eNZJA== #### Apache配置 ~~~ <IfModule mod_rewrite.c> RewriteEngine On RewriteCond %{REQUEST_FILENAME} !-f RewriteCond %{REQUEST_FILENAME} !-d RewriteRule ^(.*)$ /index.html [L] </IfModule> ~~~ ### 前端 #### 前端H5配置 在manifest.json ![](https://img.kancloud.cn/12/61/12612244536663083c91d9c2ae6d647b_835x773.png) #### 调试 H5 ![](https://img.kancloud.cn/e0/a7/e0a779fd218fdc659a5993f15897cbbf_551x182.png) #### 发布 H5 ![](https://img.kancloud.cn/e3/34/e334651b5bf1d2fe69fc38a53d8bbc24_426x419.png) * 填写 网站名称标题 ![](https://img.kancloud.cn/04/61/04617008087e2a0b08785dbfedec0e1a_426x195.png) * 打包成功 ![](https://img.kancloud.cn/95/6d/956d7737381aef70008f78b0a65a477b_1200x455.png) * 将两个文件上传到宝塔前端站点根目录,如图所示: ![](https://img.kancloud.cn/5b/8f/5b8f22575aae1be0fd513c2dd87a00ab_1200x278.png) #### H5 生成海报 * 配置必要的商城配置 ![](https://img.kancloud.cn/7d/17/7d178961d55d2a451ab17e50565ab7e8_723x460.png) ![](https://img.kancloud.cn/5f/60/5f6072685b9ae55491cff2c985ec66fd_752x553.png) * 如果一切都配置正确,将能直接看到海报 ![](https://img.kancloud.cn/93/4c/934cbcb50d42fdad28f91099466bc634_414x736.png)