因项目需要,pc、h5是分开开发的,最终部署的时候也会分开xx.com为pc xx.com/m为m端,
因为一开始对nginx不是很熟悉,因此跳转的方式是让运维人员直接重定向编写,上线时出现很多问题,
特此琢磨了一下正确的部署方式。
部署到根目录的项目可以正常配置即可,(注意,pc端的路由不要和m端重复,如果重复会导致很多问题发生,例如m端(第二项目)的路径是/m/时,在pc的业务路由中就不建议出现path: '/m/**')。
server {
listen 80;
server_name myccmdefi.com;
#root "C:/phpstudy_pro/WWW/x.com";
location / {
root "C:/phpstudy_pro/WWW/x.com/";
index index.html;
try_files $uri $uri/ /index.html;
}
location /m/ {
alias "C:/phpstudy_pro/WWW/x.com/dist/";
try_files $uri $uri/ /dist/index.html;
index index.html;
}
}
nginx的配置表如上,
注意下router的配置, 需要改一些配置项目:
//router.js
const router = createRouter({
history: createWebHistory('/m'),
routes
})
//增加路由base路径
// vue.config.js
module.exports = {
...
publicPath: "/m/",
...
}
// index.html
<meta base="/m" />
// 以上3个地方均要配置, 而且需要和运维人员商讨好 最终不可变,
按以上方式配置好后,项目文件夹可分开存放,也可放在一起,一切准备好后即可发布项目