开始前,确保本地已安装了docker 、Vue、Npm、Node。
项目源码github地址。
https://github.com/Mary5haw/vue-docker-nginx
项目中已经保存所有代码,只需按下面步骤运行即可启动。
新建Vue项目后,主要新建配置了nginx和Dockerfile文件,其他其实和正常搭建运行Vue项目没有变化。
将vue项目配合nginx在docker中打包运行
项目运行步骤
# 打开docker
#下载docker中下载nginx
docker pull nginx
# 安装vue项目中的npm依赖
npm install
# 本地打包,生成dist文件
npm run build
# docker创建镜像
docker build -t vue-docker-nginx .
# 本地localhost:4000端口监听容器80容器启动docker
docker run -p 4000:80 -d vue-docker-nginx
现在就可以在本机游览器查看在docker中启动的项目了。http://localhost:4000/
[图片上传失败...(image-7d1c85-1577809951589)]
网友评论