使用Dockerfile部署vue项目
项目需要部署到甲方电脑上,使用docker是个不错的选择。1、创建Dockerfile文件# 设置基础镜像FROM nginx:latest# 将dist文件中的内容复制到 /usr/share/nginx/html/ 这个目录下面COPY dist//usr/share/nginx/html/# 用本地的 default.conf 配置来替换nginx镜像里的默认配置COPY default.c
·
项目需要部署到甲方电脑上,使用docker
是个不错的选择。
1、创建Dockerfile
文件
# 设置基础镜像
FROM nginx:latest
# 将dist文件中的内容复制到 /usr/share/nginx/html/ 这个目录下面
COPY dist/ /usr/share/nginx/html/
# 用本地的 default.conf 配置来替换nginx镜像里的默认配置
COPY default.conf /etc/nginx/conf.d/default.conf
2、创建镜像中nginx
配置文件
新建文件default.conf
# nginx配置
server {
listen 80;
server_name localhost;
#charset koi8-r;
access_log /var/log/nginx/host.access.log main;
error_log /var/log/nginx/error.log error;
location / {
# root 根目录,默认nginx镜像的html文件夹,可以指定其他
root /usr/share/nginx/html;
index index.html index.htm;
# 如果vue-router使用的是history模式,需要设置这个
try_files $uri $uri/ /index.html;
}
#error_page 404 /404.html;
# redirect server error pages to the static page /50x.html
#
error_page 500 502 503 504 /50x.html;
location = /50x.html {
root /usr/share/nginx/html;
}
}
3、个人喜欢在package
自定义命令:
"scripts": {
"dev": "vue-cli-service serve --open",
"build": "vue-cli-service build",
"lint": "vue-cli-service lint",
"docker-build": "docker build -t bim-web ."
},
4、构建镜像使用命令
npm run docker-build
5、实例化容器
docker run -p 3000:80 -d --name bim-web bim-web
更多推荐
已为社区贡献21条内容
所有评论(0)