Webpack 构建太慢：先改这 4 处再谈换工具

webpack 一改代码就编译半天，或 CI 构建动辄数分钟——先别立刻迁移 Vite。多数项目靠 缩小 loader 作用范围 + 缓存 + 少解析 就能明显降耗时。索引长文见 Webpack 问题索引。

你遇到的问题

解法（按性价比）

1. loader 加 include/exclude

只处理 src，排除 node_modules（除非真要编译某包）。

2. 打开持久化缓存（Webpack 5）

module.exports = {
  cache: {
    type: "filesystem",
  },
};

3. 解析少做无用功

• 合理 resolve.extensions / alias
• 避免过多全量同步插件在每次构建跑重任务

4. 开发与生产配置分离

开发关掉过度压缩与无用的生产-only 插件；生产再开 minimize。

如何验证

# 记录耗时，改一处测一次
npx webpack --mode development

• 二次构建明显快于冷启动（缓存生效）
• 改单个业务文件时，rebuild 时间下降
• CI 若挂缓存目录，全量时长下降

下一步

1. 体积问题见 包体积排查。
2. 代理/HMR 见 devServer 文。
3. 若仍不可接受，再评估 Vite/Rspack——带着耗时数据迁移。