多阶段构建配合轻量基础镜像（如Alpine或Distroless）和构建时清理，可将含JS/CSS/图片的Web镜像从800MB压至60MB左右；核心是仅打包运行必需文件，剔除构建产物、开发依赖与临时缓存。
直接用多阶段构建剥离静态资源，再配合轻量基础镜像和构建时清理，能把含大量 JS/CSS/图片的 Web 镜像从 800MB 压到 60MB 左右。核心不是“压缩文件”，而是避免把构建产物、开发依赖、临时缓存一起打包进最终镜像。
选对基础镜像：别让 70MB 的系统拖垮你的 5MB 应用
静态资源服务（比如 Nginx 托管前端）不需要 Shell、包管理器或编译工具。Ubuntu 或 CentOS 镜像自带大量冗余组件，光基础层就占 70–200MB。换成 Alpine 或 Distroless 可立减一半以上体积。
- 推荐首选 Alpine：5.5MB 起步，支持 apk 安装必要运行时（如 tzdata、ca-certificates），且兼容绝大多数静态服务配置
-
极致精简用 distroless：Google 提供的
gcr.io/distroless/static-debian11仅 2.5MB，无 shell、无包管理器，适合只跑 Nginx 二进制或自定义静态服务器 - 避开 Ubuntu:latest / node:18 等全功能镜像——它们默认带 npm、python、gcc 等，静态部署完全用不到
多阶段构建：把构建环境和运行环境彻底分开
很多镜像臃肿，是因为把构建过程（npm install、webpack 打包、压缩混淆）和最终服务混在同一个镜像里。多阶段构建能确保只有生成的 HTML/JS/CSS 文件进入最终层。
- 第一阶段用
node:18-alpine完成构建：COPY . . && npm ci && npm run build - 第二阶段用
nginx:alpine或alpine:3.18+ 手动安装 nginx：COPY --from=builder /app/dist /usr/share/nginx/html - 关键点：不 COPY
node_modules、src、package.json等源码和依赖目录，只复制dist输出目录
构建时清理：删掉临时文件、调试工具和未用依赖
即使用了 Alpine，RUN 指令若不主动清理，也会把中间产物固化为镜像层。尤其注意 npm/yarn 缓存、压缩包解压残留、临时日志等。
- 在构建阶段末尾加清理命令：
&& npm cache clean --force && rm -rf /root/.npm - 安装工具时用
--no-cache（Alpine）或--autoremove -y（Debian）：apk add --no-cache nginx - 避免分多条 RUN：把安装、配置、清理写在同一行，减少镜像层数（每条 RUN 新增一层）
- 删除默认 Nginx 页面、示例配置、未启用模块：
rm -rf /usr/share/nginx/html/* && rm -f /etc/nginx/conf.d/default.conf
静态资源预处理：在构建阶段完成压缩与裁剪
镜像体积大，常因未优化的资源本身过大。与其在运行时处理，不如在构建阶段完成标准化压缩，既减体积又提性能。
- Webpack/Vite 构建时开启
compression: true（生成 .gz 文件），Nginx 启用gzip_static on;直接返回压缩后文件 - 用
svgo压缩 SVG、jpegoptim和pngquant处理图片（放在构建阶段，不打进最终镜像） - 移除 source map、devtools、console.log 等调试内容；禁用未使用的字体、图标库子集
本质上，静态资源镜像瘦身不是靠“打 zip”，而是靠“做减法”：砍掉所有非运行必需的东西，只留下 HTTP 服务器 + 优化后的文件。只要构建逻辑清晰、阶段职责分明，60MB 以内是常规目标，10–30MB 也完全可行。
