vue部署,nginx同域名多项目部署

1、修改vue生成参数

1、dist/index.html文件修改
    添加 <meta base="/子目录名/">

vue部署,nginx同域名多项目部署

2、config/index.js文件修改
    修改 assetsPublicPath: '/子目录名/'

vue部署,nginx同域名多项目部署

3、src/router/index.js文件修改
    添加 base: '/子目录名/'

vue部署,nginx同域名多项目部署

2、nginx配置

server {
        listen       80;
        root /www/web/www_xxx_com/public_html/public;
        server_name www.xxx.com;
        index  index.html index.php index.htm;
        error_page  400 /errpage/400.html;
        error_page  403 /errpage/403.html;
        error_page  404 /errpage/404.html;
        error_page  503 /errpage/503.html;
        location ~ \.php$ {
                proxy_pass http://127.0.0.1:88;
                include naproxy.conf;
        }
        location ~ /\.ht {
                deny  all;
        }
        location / {
                try_files $uri @apache;
        }
        location @apache {
                 internal;
                 proxy_pass http://127.0.0.1:88;
                 include naproxy.conf;
        }

        #vue环境部署
        set $vue_files /www/vue/www_xxx_com;
        location /vue-mobile {
            root $vue_files;
            try_files $uri $uri/ /vue-mobile/index.html;
            if ($http_user_agent !~* (mobile|nokia|iphone|ipad|android|samsung|htc|blackberry)) {
                rewrite  ^/(.*)$  http://$server_name/vue-pc;
            }
        }
        location /vue-pc {
            root $vue_files;
            try_files $uri $uri/ /vue-pc/index.html;
            if ($http_user_agent ~* (mobile|nokia|iphone|ipad|android|samsung|htc|blackberry)) {
                rewrite  ^/(.*)$  http://$server_name/vue-mobile;
            }
        }
}