diff --git a/Dockerfile b/Dockerfile new file mode 100644 index 0000000..f388e46 --- /dev/null +++ b/Dockerfile @@ -0,0 +1,20 @@ +# 第一阶段:node镜像打包 +FROM node:latest AS frontend-builder +WORKDIR /build-app +COPY . . +RUN npm install +RUN npm run build:prod + +# 第二阶段:nginx打包 +FROM nginx:latest +EXPOSE 80 +WORKDIR /app +# 替换nginx配置 +COPY ./nginx.conf /etc/nginx/conf.d/default.conf +# 将第一阶段的静态文件复制到nginx中 +RUN rm -rf /usr/share/nginx/html +RUN mkdir /usr/share/nginx/html +COPY --from=frontend-builder /build-app/dist /usr/share/nginx/html + +# 运行 +CMD ["nginx", "-g", "daemon off;"] diff --git a/nginx.conf b/nginx.conf new file mode 100644 index 0000000..c480c0c --- /dev/null +++ b/nginx.conf @@ -0,0 +1,21 @@ +server { + listen 80; + listen [::]:80; + server_name localhost; + + access_log /var/log/nginx/host.access.log main; + + location / { + root /usr/share/nginx/html; + index index.html index.htm; + + # 新增下面这句,其他是默认nginx配置 + # 解决部分前端框架的路由问题,在浏览器刷新报错404 + try_files $uri $uri/ /index.html; + } + + error_page 500 502 503 504 /50x.html; + location = /50x.html { + root /usr/share/nginx/html; + } +}