Dockerfile 一键部署Vue项目

第一步

• 第一先把前端打包 目录下面就会出现 dist

第二步

编写 Dockerfile 文件 名字可改可不改

FROM node:latest as builder
WORKDIR /jayvuedockerfiledemocode
COPY package.json ./
RUN npm install
COPY . .
RUN npm run build
FROM nginx:latest
COPY /nginx.conf /etc/nginx
COPY --from=builder /jayvuedockerfiledemocode/dist  /usr/share/nginx/html

第三步

编写 nginx.conf 文件 备用

• nginx.conf 文件 我这就简单写一下了 按照自己需求去

events {
  worker_connections  1024;
}
http{
  server {
    listen       80;
    server_name  localhost;
    location / {
      root   /usr/share/nginx/html;
      index  index.html index.htm;
    }
    error_page   500 502 503 504  /50x.html;
    location = /50x.html {
      root   /usr/share/nginx/html;
    }
  }
}

第四步

dist Dockerfile nginx.conf 上传到服务器 需在同一个目录 打包镜像 运行容器

docker build -t 镜像名称 -f Dockerfile .
docker run -d -p 80:80 --name 镜像名 打包好的镜像名或者ID