docker中使用nginx进行多个vue部署以及为什么部署完成后会404的原因

因为对nginx不熟，同事也都是一些实习生，很多东西他们也不熟悉，导致要在nginx加入其他项目进行运行，导致一直404，我在网上找了很多方法，都进行了尝试，发现都没效果，后面我也发现了docker中的nginx和通过tar解压的方式有些不同，所以纪录一下这个问题的解决方式。

1.安装nginx,(我这个是下载最新版本的，想下载自己想要的版本，请在docker pull nginx:版本号,如果没了解过docker的可以往前看我的docker博客)，其他的安装方式就跟我之前写的docker安装nginx是一样的可以往前面看我的nginx安装博客

docker pull nginx

2.既然安装好了nginx，接下来我们就需要进行多项目部署了，因为是进行容器挂载的，我们只需要修改我们挂载的文件就行，一开始我修改的是nginx下的nginx.conf文件，以为都能够使用，”但是，修改是无效果的，同时我也通过docker的命令进入nginx中在安装中的路径修改，但是只要我重启一下docker就nginx在etc下修改的nginx.conf就将修改的内容全部清除了。”

3.经过2的步骤我思考了好久，突然发现，我修改为什么没有效果，因为，在/mydata/nginx/conf/nginx.conf中有这么一行，就是需要修改/mydata/nginx/conf/conf.d/*.conf文件才有效

4.所以，我就去修改了/mydata/nginx/conf/conf.d中的*.conf文件，发现有效果了，就将修改了参数，如下图：

图中的参数，如果有多个项目，值需要修改下面的内容即可

location /test {
        root   /usr/share/nginx/html; //这个是不动的，因为安装nginx就存在了
        index  index.html;  //访问的是html还是htm
        try_files $uri $uri/ /test/index.html;  //这里就是解决vue打包项目后出现404的原因（/vue项目名称/index.html）
    }  

5.既然nginx中的东西解决了，接下来我们要解决vue（cli3以上）中的二级打包问题，主要修改三个地方，如下三张图：

修改完成后打包放在docker挂载的nginx目录下的html下即可访问项目的二级目录的项目了。