初始化前后端学生管理系统项目

student_system/vue/Dockerfile

@@ -0,0 +1,37 @@
+# ====================== 第一阶段：构建 ======================
+# 用 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;"]