nginx配置多個vue項目

1.該項目是基於cli2.0來做的

2.修改config---->index.js--->build 模塊

 build: {
    // Template for index.html
    index: path.resolve(__dirname, '../dist/index.html'),

    // Paths
    assetsRoot: path.resolve(__dirname, '../dist'),
    assetsSubDirectory: 'static',
    assetsPublicPath: '/vant/',
}

把 assetsPublicPath修改爲你在nginx配置的路徑

3.把router-->index.js的模式調整爲

 mode : 'history',
 base : '/vant/',

這裏的base 要對應 build裏面的 assetsPublicPath 和nginx裏面的，不然js文件會找不到

 

4.配置nginx

server {
	listen 80;
	server_name localhost;
	#root /home/www/dist/;

    location ^~ /vant {
        alias /home/www/vant;
        try_files $uri $uri/ /index.html last;
        index index.html;
    }
    
    location /admin {
        alias /home/www/admin;
        try_files $uri $uri/ /index.html last;
        index index.html;
    }
}

這裏配置了倆個項目 一個vant 一個admin  

主要的點就是 try_files ：這段是爲了vue查找index，防止刷新界面就沒有，出現空白等

alias 和root的區別 是會加上上面的後綴，可以自行百度。