简介
print-chunks-plugin 是一个 webpack 插件，用于在编译时输出打包后每个 chunk 的信息，如 chunk 名称、chunk 大小、每个模块的大小等。这对于开发者来说能更好地了解打包后的代码情况、优化性能以及发现可能存在的问题。
安装
使用 npm 安装：
--- ------- ---------- -------------------
使用
在 webpack 配置文件中引入插件并添加到 plugins 数组中即可：
----- ----------------- - -------------------------------
-------------- - -
-------- -
--- -------------------
-
--插件默认只会在生产环境下启用。如果需要在开发环境下启用，可以指定 enabled 选项为 true：
--- --------------------------- ------
示例
考虑下面的 webpack 配置文件：
----- ----------------- - -------------------------------
-------------- - -
------ -----------------
------- -
--------- ------------------------
-------------- -----------------------
--
------------- -
------------ -
------- ------
-------- ----
-
--
-------- -
--- --------------------
--- -------------------
-
--通过使用 print-chunks-plugin，我们能得到类似以下的输出：
------ -- ------
--------------------------- --- ----- - --------- ----------- ---
----------------------------------- ------ --- - --------- ----------- -----------
---------------------------- ---- --- - --------- ----
------------
--- ----- ----
---------------------------
----------- ------- ----
-----------------------------------
---- ----- ----
----------------------------其中，输出的每个 chunk 包括文件名、文件大小、排序位置、输出状态、chunk 名称等信息。EntryPoint 则输出每个入口文件所包含的 chunk。
注意事项
print-chunks-plugin 中的输出信息包括 webpack4 分块优化 产生的 chunk。如果此插件和其他分离插件同时使用，可能会有重复的 chunk 输出情况。
结论
借助 print-chunks-plugin 这个库，我们可以更好的了解打包后的代码情况，除此之外，也可以根据该插件输出的信息进行优化性能或查找可能的问题。
来源：JavaScript中文网 ，转载请联系管理员！ 本文地址：https://www.javascriptcn.com/post/600575c581e8991b448ea74d