38 lines
1.2 KiB
Docker
38 lines
1.2 KiB
Docker
# ====================== 第一阶段：构建 ======================
|
|
# 用 Node 镜像把 Vue 源码打包成静态文件
|
|
FROM node:20-alpine AS builder
|
|
|
|
WORKDIR /app
|
|
|
|
# 先只复制依赖清单并安装依赖：这样改业务代码时不会重新安装依赖，能复用缓存
|
|
COPY package*.json ./
|
|
RUN npm install --registry=https://registry.npmmirror.com
|
|
|
|
# 再复制全部源码并打包（Vite / Vue CLI 默认产物目录都是 dist）
|
|
COPY . .
|
|
RUN npm run build
|
|
|
|
|
|
# ====================== 第二阶段：运行 ======================
|
|
# 只保留打包结果，用体积小的 Nginx 托管，镜像里不含 node_modules
|
|
FROM nginx:1.27-alpine
|
|
|
|
LABEL maintainer="student-system" description="学生管理系统 - Vue 前端"
|
|
|
|
# 后端接口地址（nginx.conf.template 里会用到这两个变量做反向代理）
|
|
ENV BACKEND_HOST=fastapi \
|
|
BACKEND_PORT=8004
|
|
|
|
# 删除 nginx 默认欢迎页
|
|
RUN rm -rf /usr/share/nginx/html/*
|
|
|
|
# nginx 官方镜像会自动把 /etc/nginx/templates/*.template 渲染成 /etc/nginx/conf.d/*.conf
|
|
COPY nginx.conf.template /etc/nginx/templates/default.conf.template
|
|
|
|
# 从构建阶段拷贝打包好的静态文件
|
|
COPY --from=builder /app/dist /usr/share/nginx/html
|
|
|
|
EXPOSE 80
|
|
|
|
CMD ["nginx", "-g", "daemon off;"]
|