前置知识

为什么使用dockerfile和nginx参考 https://blog.csdn.net/weixin_44598727/article/details/108269718

文件准备

111316_42303ace_7723216

default.conf

参考 https://blog.csdn.net/fuck487/article/details/103100014

但注意有两个地方要更改

111324_94d012b6_7723216

Dockerfile

# 设置基础镜像
FROM nginx
# 将dist文件中的内容复制到 /usr/share/nginx/html/ 这个目录下面
COPY dist/  /usr/share/nginx/html/
# 用本地的 default.conf 配置来替换nginx镜像里的默认配置
COPY default.conf /etc/nginx/conf.d/default.conf

linux控制台内执行

# 进入自建文件夹
cd /home/xjs/testvue/
# 构建镜像,版本为6.0,自己定
docker build -t testvue:6.0 .
# 运行镜像为容器,这里注意服务器要更改安全策略,如开启9090端口
docker run -d -p 9090:80 --name testvue testvue:6.0

参考

Docker简单粗暴的部署Vue项目详解 https://blog.csdn.net/weixin_44598727/article/details/108269718

dockerfile部署vue项目 https://blog.csdn.net/fuck487/article/details/103100014

docker–部署vue项目 https://www.cnblogs.com/zouzou-busy/p/11838524.html

到此为止已经结束,这里分享过程中很可能用到的linux语句

彻底删除镜像

docker ps
#停止容器
docker stop 容器ID
#卸载容器
docker rm 容器ID

docker images
#删除镜像
docker rmi -f 镜像ID

查看容器内nginx配置

# 进入前面建好的容器
docker exec -it 容器ID bash
# 容器内部执行,进入项目文件存放位置
cd /usr/share/nginx/html/
# 容器内部执行,查看nginx配置是否正确
more /etc/nginx/conf.d/default.conf