VUE上线打包以及关于Nginx的配置问题

Question

我现在有一个关于VUE上线打包以及关于Nginx的配置问题。

问题一：关于vue.config.js的配置项

module.exports = {
    publicPath: '',
    assetsDir: 'assets',
}

这里的问题是：关于publicPath和assetsDir的关系是怎么样的？

// 这种表示什么？
module.exports = {
    publicPath: '/',
    assetsDir: 'assets',
}
// assetsDir 加了 ./ 相对路径 会不会有什么不同？
module.exports = {
    publicPath: '/',
    assetsDir: './assets',
}
// 设定了 publicPath 之后，打包后里面的路径又是怎么样的？
module.exports = {
    publicPath: 'testapp',
    assetsDir: './assets',
}

上面的就是我想问的关于 publicPath 和 assetDir 之间关系的问题。

问题二：Nginx如何配置多个VUE项目？

下面是一个Nginx的基础配置

server {
        listen       8088;
        server_name  localhost;
        root   /usr/local/var/www/;
        #charset koi8-r;

        #access_log  logs/host.access.log  main;

        location / {
            root   /usr/local/var/www/;
            try_files $uri $uri/ /index.html;
            index  index.html index.htm;           
        }
}

现在我想在 www 根路径下放置我的VUE项目。假如我有多个VUE项目，每个VUE项目单独为一个文件夹，比如：最后的形式是：
http://localhost:8088/project-1/
http://localhost:8088/project-2/
http://localhost:8088/project-3/
反正就是根路径 localhost:8088 下面，每一个文件夹代表一个VUE项目。这样的情况，如何配置Nginx。

其实我得问题对我来说难点在于何如配置VUE打包文件然后放置在Nginx服务器上。这就导致我不知道如何改vue.config.js 文件 和 配置 Nginx 服务器。

我在网上找了一些资料，有些看不太懂。有些配置就是不对。小弟学浅，还行大神帮帮忙~~~

Answer 1

vue.config.js

module.exports = {
  publicPath: '/project-1/'
}

nginx

location ^~ /project-1 {
    alias /xxx/project-1/;
    try_files $uri $uri/ index.html =404;
}

然后打包出来 dist 文件夹下的所有文件拷贝到/xxx/project-1这个路径里边。