webpack2 生产构建真的很慢“附加资产处理”

Posted 2023-02-21

【中文标题】webpack2 生产构建真的很慢“附加资产处理”

【英文标题】：webpack2 production build really slow "additional asset processing"

【发布时间】：2017-08-10 00:17:31

【问题描述】：

我有一个大型 webpack 构建，它几乎挂在 91% 的“附加资产处理”步骤上，没有给我更多信息。 仅这一步就消耗了 4 分钟，并且随着我们向构建中添加模块，它似乎呈指数级增长。 有没有办法更好地了解在此步骤中做了什么并最终对其进行优化？

56205ms building modules
31ms sealing
0ms optimizing
0ms basic module optimization
15ms module optimization
0ms advanced module optimization
0ms basic chunk optimization
0ms chunk optimization
16ms advanced chunk optimization
14487ms building modules
0ms module and chunk tree optimization
31ms module reviving
0ms module order optimization
16ms module id optimization
0ms chunk reviving
16ms chunk order optimization
31ms chunk id optimization
140ms hashing
0ms module assets processing
265ms chunk assets processing
0ms additional chunk assets processing
0ms recording
206740ms additional asset processing
79781ms chunk asset optimization
1ms asset optimization
906ms emitting

【问题讨论】：

尝试配置stats选项以显示更多信息。

@wuxiandiejia 我有统计数据，但我应该寻找什么？

或许设置成verbose可以帮到你，webpack会输出所有信息。

也有同样的问题，使用 laravel 5.3 和 gulp 在 30 秒内构建，现在升级到 laravel 5.4 和 webpack 后它也卡在 91% ......我的挂起大约 10 分钟.

CLI 标志输出计时信息：webpack --progress --profile

【参考方案1】：

不确定您的设置是什么，但在我的情况下，是 Webpack 和 Extract Text 插件导致资产加载时间过长。我更改为 Webpack 2.7.0 和 extract-text-webpack-plugin 2.1.2 并且加载恢复正常。

【讨论】：

我现在使用的是第 3 版，并且有一些改进，但仍然很慢。后来我发现，慢的部分其实是缩小，现在完全去掉了，只在部署的时候缩小。

【参考方案2】：

在我的例子中，它是 webpack babili 插件（现在是 babel-minify-webpack-plugin）。 我已将其替换为 uglifyjs-webpack-plugin。

我的配置：

new UglifyJSPlugin(
  parallel: true,
  exclude: /\/node_modules/,
  uglifyOptions: 
    ecma: 8,
    mangle: true,
    compress: 
      sequences: true,
      dead_code: true,
      conditionals: true,
      booleans: true,
      unused: true,
      if_return: true,
      join_vars: true,
      drop_console: true
    ,
    output: 
      comments: false,
      beautify: false
    
  
)