一.使用多个server配置多个vue项目(使用多个端口)
这个方式最简单,将第一份server配置拷贝一下,稍微调整一下就可以了,示例如下:
server {
listen 8088;
server_name localhost;
# 这个是第一个vue项目 页面访问地址 http://ip:8088
location / {
root /usr/share/nginx/html/dist/;
index index.html index.htm;
try_files $uri $uri/ /index.html; # 防止页面刷新404
}
... ...
}server {
listen 8089;
server_name localhost;
# 这个是第二个vue项目 页面访问地址 http://ip:8089/two
location /two {
root /usr/share/nginx/html/two/dist/;
index index.html;
try_files $uri $uri/ /index.html; # 防止页面刷新404
}
... ...
}
二、在一个server配置多个项目(共用一个端口)
server {
listen 80;
server_name localhost;
# 这个是第一个vue项目 页面访问地址 http://ip
location / {
root /usr/share/nginx/html/dist;
index index.html index.htm;
try_files $uri $uri/ /index.html;
}
# 这个是第二个vue项目 页面访问地址 http://ip/sub
location /sub {
alias /usr/share/nginx/html/sub/dist/;
index index.html;
try_files $uri $uri/ /index.html;
}
}