同一个域名想要配置多个 history 模式的 vue 项目可咋办呢...
localhost/web
localhost/admin
# 前言
因为项目需要或者大部分的web项目,有两个vue项目,一个 web 端,一个 admin 端,但如果同时要求 history 模式且只有一个域名的话...
# 配置
以
localhost/web
localhost/admin
为例
# nginx 配置
server {
listen 80;
server_name xxxxxx.com;
#config router with history
location /admin {
alias /to_your_real_folder/dist/;
index index.html;
try_files $uri $uri/ /admin/index.html;
}
location /web {
alias /to_your_real_folder/dist/;
index index.html;
try_files $uri $uri/ /web/index.html;
}
#config api
location /prod-api {
proxy_pass http://backup/api;
}
}
# 项目配置
- vue.config.js
publicPath: '/web/'
- router.js
new VueRouter({
mode: 'history',
base: '/web/',
routes: routes
})
- /admin/ 配置同理