uniapp开发环境搭建及打包H5部署至Nginx
2021/12/24 7:11:27
本文主要是介绍uniapp开发环境搭建及打包H5部署至Nginx,对大家解决编程问题具有一定的参考价值,需要的程序猿们随着小编来一起学习吧!
1、安装HBuild X工具
下载HBuild X工具,下载地址:https://www.dcloud.io/hbuilderx.html
下载解压到指定目录即可使用
2、导入项目
选中“文件”->“导入”->“从Git导入(G)…”
3、打包H5
(1)配置manifest.json
(2)选中“发行”->“网站-PC Web或手机H5(仅适用于uni-app)(H)”
输入网站标题和域名,点击【发行】
出现以下提示说明导出成功:
项目 'shop'导出h5成功,路径为:D:/Workspaces/HBuilderProjects/shop/unpackage/dist/build/h5
4、部署至Nginx
将D:/Workspaces/HBuilderProjects/shop/unpackage/dist/build/h5文件夹下得文件传至服务器/home/source/h5下
配置nginx.conf
#h5端 server { listen 10001; server_name localhost; try_files $uri $uri/ /index.html; root /home/source/h5; }
5、测试
访问地址:http://192.168.1.38:10001
6、常见问题
(1)报错:此应用 DCloud APPID 非当前账号所有,请联系应用所有者设置此账号为协作者,或重新生成APPID后打包。
解决方法:
打开manifest.json,重新获取APPID
(2)图片无法自适应
解决方法:
nginx.conf文件加上一行:
include mime.types;
这篇关于uniapp开发环境搭建及打包H5部署至Nginx的文章就介绍到这儿,希望我们推荐的文章对大家有所帮助,也希望大家多多支持为之网!
- 2024-10-29Nginx发布学习:从入门到实践的简单教程
- 2024-10-28Nginx发布:新手入门教程
- 2024-10-21nginx 怎么设置文件上传最大20M限制-icode9专业技术文章分享
- 2024-10-17关闭 nginx的命令是什么?-icode9专业技术文章分享
- 2024-09-17Nginx实用篇:实现负载均衡、限流与动静分离
- 2024-08-21宝塔nginx新增8022端口方法步骤-icode9专业技术文章分享
- 2024-08-21nginx配置,让ws升级为wss访问的方法步骤-icode9专业技术文章分享
- 2024-08-15nginx ws代理配置方法步骤-icode9专业技术文章分享
- 2024-08-14nginx 让访问带有/relid的地址返回404 ,例子 /relid-x-0.36-y-131.html-icode9专业技术文章分享
- 2024-08-14nginx 判断地址有/statics/的路径,指向到/home/html/statics/目录-icode9专业技术文章分享