nginx部署多个vue项目如何配置
程序员文章站
2022-07-02 10:00:43
...
使用同一域名或者ip去部署访问多个前端项目,比如域名/ip直接访问官网,域名/ip后面带路径去访问其它项目
一、 最终效果
官网访问地址: http://192.168.27.119/login
项目二访问地址:http://192.168.27.119/biz/login
项目三访问地址:http://192.168.27.119/admin/login
二、 vue项目中的配置修改
注:http://192.168.27.119/login 这个项目无需配置路径,直接打包即可。下面以项目二,通过/biz/访问作为例子
- 打开config下的index.js文件
将build下面的assetsPublicPath改为路径名
2. 打开 src/router/index.js 文件
添加 base: '/biz/'
3. 打开项目index.html文件,将引入的js文件路径前加上/biz/
三、nginx配置文件修改
server {
listen 80;
server_name localhost;
#charset koi8-r;
error_log /home/devtools/nginx/error.log;
access_log /home/devtools/nginx/access.log main;
location / {
root /home/datasmith/website/html;
try_files $uri $uri/ /index.html;
index index.html index.htm;
}
location ^~/admin{
alias /home/datasmith/aicall/gld/html;
try_files $uri $uri/ /admin/index.html;
}
location ^~/biz{
alias /home/datasmith/aicall/khd/html;
try_files $uri $uri/ /biz/index.html;
}
}
四、重启nginx
1.查看修改的配置文件是否有误
进入/usr/sbin/目录,运行./nginx -t
2.确认修改无误后,重启nginx
在/usr/sbin/目录下,运行./nginx -c /etc/nginx/nginx.conf
上一篇: 宋简宗赵旉:高宗赵构唯一的儿子,登基不到一个月就死了
下一篇: 朋克狗有点渗人