vue3项目docker容器化核心是多阶段构建:先用node:20-alpine构建,再将dist产物复制到nginx:stable-alpine运行,配合完整.dockerignore排除冗余文件,精简镜像、提升安全与效率。

Vue 3 项目做 Docker 容器化打包,核心是用多阶段构建:先用 Node 镜像完成构建,再把产物交给轻量 Nginx 镜像运行。不装多余依赖、不带源码、镜像体积小、启动快。
.dockerignore 文件要配全
它决定哪些文件不进镜像,直接影响构建速度和最终体积。必须排除开发期文件,保留运行必需项:
- node_modules 和 npm-debug.log —— 构建阶段由 RUN npm install 生成,本地不用复制
- dist 和 .output —— 构建产物由容器内生成,本地 dist 不参与 COPY
- .git、.vscode、.DS_Store、*.log —— 开发元数据一律忽略
- .env*.local 等环境文件 —— 防止敏感配置意外打入镜像
Dockerfile 要分两个阶段写
第一阶段专注构建,第二阶段专注服务,中间只传递 dist 目录:

