什么是 @types/terser-webpack-plugin
在前端开发中，我们通常需要使用到压缩代码的工具。在构建工具webpack中，terser-webpack-plugin就是专门用来压缩代码的插件。而@types/terser-webpack-plugin是专门用来提供typescript类型定义的npm包，是对terser-webpack-plugin插件的类型定义封装，方便我们在typescript环境下编写代码时能够使用到terser-webpack-plugin插件的类型定义。
如何使用 @types/terser-webpack-plugin
首先，需要安装terser-webpack-plugin插件和@types/terser-webpack-plugin包：
# 安装terser-webpack-plugin插件 npm install terser-webpack-plugin --save-dev # 安装@types/terser-webpack-plugin包 npm install @types/terser-webpack-plugin --save-dev
然后，在webpack配置文件中引入terser-webpack-plugin插件：
-- -------------------- ---- -------
----- ------------ - ---------------------------------
-------------- - -
-- ---
------------- -
---------- -
--- ---------------
--
--
--最后，就可以在typescript文件中使用terser-webpack-plugin插件的类型定义了：
import { Plugin } from 'terser-webpack-plugin';
new Plugin({...});参数说明
TerserPlugin构造函数支持向其中传入一些参数，可以根据实际情况进行选择。下面是一些常用的参数说明：
parallel: 是否使用多进程压缩，默认为true；terserOptions: 传递给terser的参数对象，具体参考terser的文档；extractComments: 是否保存压缩前的注释到指定的文件中；test: 匹配需要压缩的文件。
示例代码
下面是一个完整的webpack配置文件的示例，其中使用了terser-webpack-plugin插件的类型定义：
-- -------------------- ---- -------
----- ---- - ----------------
----- ------------ - ---------------------------------
-------------- - -
----- -------------
------ -----------------
------- -
----- ----------------------- --------
--------- ------------
--
-------- -
----------- ------- -------
--
------- -
------ -
-
----- --------
---- ------------
-------- ---------------
--
--
--
------------- -
---------- -
--- --------------
--------- -----
-------------- -
--------- -
------------- -----
--
--
---------------- -----
----- ----------------
---
--
--
-------- ---
--总结
使用@types/terser-webpack-plugin包可以让我们在编写使用terser-webpack-plugin插件的代码时编写更加安全和规范的代码，同时在写代码时也会有更好的代码补全和代码提示。如果你在使用typescript环境下使用了terser-webpack-plugin插件，一定记得使用@types/terser-webpack-plugin包。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/192595