Hard-source-webpack-plugin 真的还能用吗？配置后反而变慢了？

Dev · 子香提问于 2026-03-11 19:33:21 阅读 11

优化

我听说 hard-source-webpack-plugin 能大幅加快二次构建速度，就试着在项目里加了。但装完之后第一次构建巨慢，第二次也没快多少，是不是我哪里配错了？

我的 webpack 版本是 5.88.2，插件版本是 0.13.1，按文档加了这行：

new HardSourceWebpackPlugin()

结果控制台还报了一堆警告，说 cache 目录冲突。现在怀疑这个插件是不是已经不兼容 webpack5 了？

构建优化

我来解答赞 6 收藏

反馈

1 条解答

Good“炳诺 Lv1

这个插件在 webpack5 场景下基本可以扔了，不是你配错了，是它本身就和 webpack5 不太对付。

webpack5 从一开始就内置了持久化缓存机制，效果跟 hard-source 差不多，甚至更稳。你用这个插件反而会冲突，因为它也要写缓存目录，两边抢起来了，所以你会看到那些冲突警告。

正确做法：直接删掉 hard-source-webpack-plugin，然后在 webpack 配置里开启缓存就行：

// webpack.config.js

module.exports = {

  cache: {

    type: 'filesystem', // 开启持久化缓存

    buildDependencies: {

      // 当这些文件变化时，缓存失效

      config: [__filename]

    }

  },

  // 其它配置...

}

这样配置完，第一次构建正常构建，然后会生成缓存文件在 node_modules/.cache/webpack 里。第二次构建会明显快很多，一般能快 70%-80% 的样子。

另外提醒一下，0.13.1 这个版本确实有点老，如果非要坚持用这个插件，可以试试 hard-source-webpack-plugin-exclude-modules-plugin 这个配套插件，但真心没必要，webpack5 原生缓存已经够香了。

2026-03-11 20:00