Webpack：什么是没有加载器的模块？如何优化它们？

Question

我在使用 speed-measure-webpack-plugin 来测量我的Webpack构建的性能，但有一件事让我感到很神秘：当冷启动我的开发构建时，我看到的是 modules with no loaders 是目前最常见的模块类型，也是处理时间最长的模块类型。

 SMP  ⏱  Loaders
modules with no loaders took 48.51 secs
  module count = 2963
typings-for-css-modules-loader, and
postcss-loader, and
less-loader took 41.81 secs
  module count = 95
ts-loader took 39.55 secs
  module count = 488
babel-loader took 4.12 secs
  module count = 4
css-loader, and
postcss-loader took 3.91 secs
  module count = 1
url-loader took 1.13 secs
  module count = 10
pegjs-loader took 0.723 secs
  module count = 2
style-loader, and
typings-for-css-modules-loader, and
postcss-loader, and
less-loader took 0.157 secs
  module count = 95
html-webpack-plugin took 0.045 secs
  module count = 1
style-loader, and
css-loader, and
postcss-loader took 0.002 secs
  module count = 1

我的问题是：到底什么是没有加载器的模块？有没有办法列出所有这些没有加载器的模块，这样我就可以知道它们的来源，以及如何处理它们？

我怀疑它们来自于 node_modules 但我不知道该怎么办......

Answer 1

好吧，在删除了 include 选项中的这个规则的webpack配置。

      {
        test: /\.jsx?$/,
        // include: path.resolve(__dirname, 'src'),
        use: ['babel-loader'],
      },

我可以没有加载器的模块，所以我假设它们都是来自于 node_modules.

然而，让我失望的是，这实际上 缓慢 我的构建。

 SMP  ⏱  Loaders
babel-loader took 1 min, 0.222 secs
  module count = 2946
typings-for-css-modules-loader, and
postcss-loader, and
less-loader took 41.55 secs
  module count = 95
ts-loader took 35.4 secs
  module count = 488
css-loader, and
postcss-loader took 26.68 secs
  module count = 12
modules with no loaders took 5.18 secs
  module count = 10
url-loader took 1.69 secs
  module count = 25
pegjs-loader took 0.597 secs
  module count = 2
style-loader, and
typings-for-css-modules-loader, and
postcss-loader, and
less-loader took 0.104 secs
  module count = 95
html-webpack-plugin took 0.025 secs
  module count = 1
style-loader, and
css-loader, and
postcss-loader took 0.009 secs
  module count = 12

我不相信有办法真正优化这个... I don't believe there is a way to actually optimize this...