init

frontend/Dockerfile

@@ -0,0 +1,34 @@
+# Dockerfile
+
+# ---- Stage 1: Build ----
+# 使用一个包含 Node.js 的镜像来构建前端应用
+FROM node:18-alpine AS builder
+
+WORKDIR /app
+
+# 复制 package.json 和 package-lock.json 并安装依赖
+# 这样可以利用 Docker 的层缓存
+COPY package*.json ./
+RUN npm install
+
+# 复制所有源代码
+COPY . .
+
+# 执行构建命令
+RUN npm run build
+
+# ---- Stage 2: Production ----
+# 使用一个轻量的 Nginx 镜像来托管构建好的静态文件
+FROM nginx:alpine
+
+# 从构建阶段复制编译好的文件到 Nginx 的网站根目录
+COPY --from=builder /app/dist /usr/share/nginx/html
+
+# 复制自定义的 Nginx 配置文件
+COPY nginx.conf /etc/nginx/conf.d/default.conf
+
+# 暴露 80 端口
+EXPOSE 80
+
+# 启动 Nginx
+CMD ["nginx", "-g", "daemon off;"]