服务器docker部署vue项目

自己之前写过一篇博客，这次部署的时候再去看。“这是写的啥？”
这次部署按照网上的一篇博客加上次的经验，弄了一个下午，（真菜
http://www.dockone.io/article/8834
https://www.cnblogs.com/zouzou-busy/p/11838524.html
按照这两篇博客，我试了好几次都是访问到nginx的那个默认页面，不知道原因在哪里，可能是docker的问题，docker是宝塔面板上面直接一键安装的。
然后想到既然访问到了页面，那么把这个页面的资源换成自己的静态资源就好了。

后来发现原因在于没有按照上面博客的要求把配置文件放到镜像里面去，容器是基于镜像构建，下面这个是说明基于镜像构建出来的容器的配置文件是放在哪的以及静态文件放在哪
vi Dockerfile

FROM nginx
COPY dist/ /usr/share/nginx/html/
COPY nginx/default.conf /etc/nginx/conf.d/default.conf

自定义构建镜像的时候基于 Dockerfile 来构建。
FROM nginx 命令的意思该镜像是基于 nginx:latest 镜像而构建的。
COPY dist/ /usr/share/nginx/html/ 命令的意思是将项目根目录下 dist 文件夹下的所有文件复制到镜像中 /usr/share/nginx/html/ 目录下。
COPY nginx/default.conf /etc/nginx/conf.d/default.conf 命令的意思是将 Nginx 目录下的 default.conf 复制到 etc/nginx/conf.d/default.conf，用本地的 default.conf 配置来替换 Nginx 镜像里的默认配置。

docker build -t 镜像名.
（.表示在当前目录下自动去找Dockerfile）

docker image ls

docker run -p 8001:80 -d --name 容器名 镜像名

下面是后续修改可以这样修改静态文件

服务器docker部署vue项目

查看容器中的文件：

docker exec -it f729d7761456  bash
cd /usr/share/nginx/html

进入到你打包项目的文件夹下 ls能看到：
服务器docker部署vue项目

把静态文件拷贝到容器中去
/usr/share/nginx/html
这个路径是docker容器中nginx放静态文件的文件夹，也是上面两篇博客配置中的路径

docker cp  . f729d7761456:/usr/share/nginx/html

查看容器中的文件：
已经成功放进容器

docker exec -it f729d7761456  bash
cd /usr/share/nginx/html

然后访问成功