uniapp 怎么打包成H5应用就不多赘述,这里说一下,怎么一个Nginx 部署多个uniapp,不同路径
- manifest.json配置文件,点击H5配置,运行的基础路径配置成 ./
- manifest.json配置文件,点击源码视图进行配置修改,代码如下
"h5" : {
"template" : "template.h5.html",
"router" : {
"mode" : "hash",
"base" : "./"
},
// pubilcPath的路径要和H5配置中的运行基础路径一致
"publicPath" : "./",
"devServer" : {
"disableHostCheck" : true, //禁止访问本地host文件
"port" : 8088,
"https" : false
},
"sdkConfigs" : {
"maps" : {
"qqmap" : {
"key" : ""
}
}
},
"title" : "XXXXXXX",
"optimization" : {
"treeShaking" : {
"enable" : true
}
}
}
源码视图中主要修改router下得base属性,publicPath属性,disableHostCheck属性设置成true,
修改配置后开发H5打包
- Nginx 配置如下
location / {
root /usr/local/hsp/mobile; # 代码存放路径
index index.html index.htm;
try_files $uri $uri/ /index.html;
}
location ^~ /h5123/ {
# 处理 Vue 单页面应用 路由模式为 history 模式刷新页面 404 的问题
root /usr/local/hsp/mobile2;# 代码存放路径
autoindex on;
autoindex_exact_size on;
autoindex_localtime on;
}
访问地址分别是 我这端口是80
- ip:端口
http://192.168.203.227/ - ip:端口/h5123
http://192.168.203.227/h5123