webpack 是前端开发中一款非常重要的构建工具，它能够简单易用的帮助我们完成代码打包、压缩、模块热替换等复杂的功能。但是，在某些特定的情况下，webpack 的功能可能还不够强大，比如需要在文件打包完成之后进行一些操作，此时，我们可以使用 npm 包 after-emit-hook-webpack-plugin。
安装
使用 npm 安装：
npm install after-emit-hook-webpack-plugin --save-dev
用法
在 webpack 配置文件中引入插件：
const AfterEmitHookPlugin = require('after-emit-hook-webpack-plugin');并在 plugins 数组中添加：
plugins: [
// other plugins...
new AfterEmitHookPlugin({
// options
})
]参数说明
done事件回调函数：参数为stats，表示打包完成后的状态对象。errors事件回调函数：参数为error，表示打包过程中出现的错误。warnings事件回调函数：参数为warning，表示打包过程中出现的警告。clean事件回调函数：表示在打包之前清空输出目录的事件回调函数。options.afterEmit：一个函数，该函数的参数为打包结果的stats对象。当该对象没有错误时，函数将被调用。该函数应该返回一个 promise 形式的异步函数。异步函数处理完成后，会产生一个文件名为after-emit-hook-webpack-plugin-tmp-file的文件，该文件会自动追加到compilation.assets中，并出发done事件。这个选项通常用于临时生成其他 assets 文件，并在打包之后将其加入输出文件。
示例
-- -------------------- ---- -------
----- ---- - ----------------
----- -- - --------------
----- ------------------- - ------------------------------------------
-------------- - -
------ -----------------
------- -
----- ----------------------- --------
--------- ------------
--
-------- -
--- ---------------------
---------------- -
-- ------------------- -
------ ------------------
-
------ --- ----------------- -- -
----- ----------- - ---------
-------------
----------------------- ------- -----------
------------
----- -- -
-- ----- -
----- ----
-
----------
-
--
---
--
---
--
--在这个示例中，我们在打包完成后，会通过 afterEmit 钩子函数生成一个内容为 output 的文件 tmp.txt，并加入到输出文件夹中。注意，在该钩子函数内部，返回的是 Promise，异步完成后才会触发打包完成的事件。
总结
以上就是 npm 包 after-emit-hook-webpack-plugin 的使用教程。通过该插件，我们可以在 webpack 打包完成之后，做一些额外的操作，非常实用。在实际项目中，可以根据需要选择是否使用该插件，来优化项目的性能。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/60059bc481e8991b448ed454