Fitten Code一键生成前端多阶段Dockerfile：第一阶段用node:18-alpine构建并打包，第二阶段用nginx:alpine仅复制dist目录，镜像精简、安全、构建快。
☞☞☞AI 智能聊天, 问答助手, AI 智能搜索, 多模态理解力帮你轻松跨越从0到1的创作门槛☜☜☜
你需要为前端项目快速生成一个生产就绪的 Dockerfile，要求镜像体积小、构建快、运行安全，且必须采用多阶段构建——不能手动逐行敲指令，也不能依赖外部模板工具。
确认项目结构与构建依赖
进入项目根目录，确保存在 【package.json】 和 【src/】 目录；若使用 pnpm，还需确认已安装 pnpm（pnpm -v 可验证）；缺少任一条件将导致后续生成的 Dockerfile 构建失败。
执行 ls -a | grep -E "^(package\.json|pnpm-lock\.yml|yarn\.lock|node_modules)$"，确认锁文件类型，这决定后续 RUN 指令中应使用 pnpm install 还是 yarn install。
用 Fitten Code 一键生成 Dockerfile
在 VS Code 中打开项目根目录 → 按 Ctrl+Shift+P（Windows/Linux）或 Cmd+Shift+P（macOS）→ 输入 “Fitten Code: Generate Dockerfile” → 回车。
弹出选项面板后，选择 “Frontend (React/Vue/Svelte)” → 再选择构建工具（pnpm / yarn / npm）→ 最后选择目标环境：选 “Production (Multi-stage)”。
该操作会自动生成 Dockerfile 并保存在项目根目录；【不要手动修改生成后的 FROM 行中的镜像标签，如 node:18-alpine → node:20-alpine，否则可能破坏缓存链】。
验证生成内容是否符合多阶段规范
打开刚生成的 Dockerfile，检查是否包含两个明确的 FROM 指令：
第一阶段以 FROM node:18-alpine AS builder 开头，且紧随其后有 COPY package*.json ./ → RUN pnpm install --frozen-lockfile → COPY . . → RUN pnpm build；
第二阶段以 FROM nginx:alpine 或 FROM nginx:stable-alpine 开头，且仅含 COPY --from=builder /app/dist /usr/share/nginx/html 和 EXPOSE 80；
若第二阶段仍残留 RUN apk add ... 或 npm install，说明生成逻辑异常，需删除该文件并重新触发生成。
执行构建并验证镜像分层
在终端中运行：docker build -t my-fe-app .
构建完成后，运行：docker history my-fe-app；观察输出中是否仅有 3～5 层，且 builder 阶段的层全部标记为 “missing”，而最终镜像层中不含 node_modules、src/ 或任何构建工具路径；
若看到 node_modules 出现在最后一层，说明 COPY 指令未正确限定 --from=builder，需回退修改 Dockerfile 第二阶段的 COPY 行。
