什么是 @gerhobbelt/babel-helper-plugin-utils?
@gerhobbelt/babel-helper-plugin-utils 是一个 Babel 插件开发过程中的工具集，它提供了一些常见的函数和工具类，让编写 Babel 插件更加轻松。
其中，包含了以下几个 API：
addComment()：在节点（AST Node）上增加注释。addDecorators()：在 Class 类型节点上添加装饰器。addNamed()：向当前 scope 插入lval表示的变量，初始化为init表示的表达式。addNamespace()：向当前文件 namespace 列表中添加一个名称。addSideEffect()：向当前文件中添加一个 side-effect。addToExport()：向当前文件中添加导出名称，在当前 scope 中的值为lval。addToInteropBlock()：输出一个 ES6 模块的 interop 语句，以方便其它模块使用。appendToMemberExpression()：在 memberExpression 类型的节点上追加一个属性。appendToStatements()：在当前语句列表的最后追加一个语句。expressionIsUnsupported()：判断当前语句是否会由 Babel（或其它工具）支持。
如何使用 @gerhobbelt/babel-helper-plugin-utils?
首先，你需要先安装它：
npm install --save-dev @gerhobbelt/babel-helper-plugin-utils
然后，你需要导入它：
import { addComment } from '@gerhobbelt/babel-helper-plugin-utils';最后，你就可以使用里面的 API 了：
addComment(path, type, text, line);
其中，path 为 AST Node；type 为注释类型，比如 leading 即为前置注释，inner 即为内部注释；text 为注释内容；line 为注释所在的行数。
@gerhobbelt/babel-helper-plugin-utils 的示例代码
在这里，我们举一个例子来演示如何使用 @gerhobbelt/babel-helper-plugin-utils，它将会给一个箭头函数类型节点增加一个专属于该节点的前置注释：
-- -------------------- ---- -------
------ - ---------- - ---- ----------------------------------------
----- ------- - -
----------------------------- -
---------------- ---------- ----- -- -- ----- -------- -- ---- ----------------------------- --------------------------
--
--
------ ------- -- -- -
------ -
----- --------------------------------
--------
--
--通过这个插件，你可以在你的 JavaScript 代码中，增加类似于以下这样的注释：
// This is an arrow function at line 4
const sub = (a, b) => {
return a - b;
}这句注释说明了这个箭头函数（Arrow Function）是一个在第 4 行定义的函数，可以为代码维护者提供一定的便利性。
结语
@gerhobbelt/babel-helper-plugin-utils 提供了很多方便开发的功能，比如增加注释、增加导出，这些方法在开发 Babel 插件时非常实用。目前，它已经被广泛的使用在很多开源项目中，并得到了很好的反馈。
通过上面的介绍，相信读者已经能够掌握如何在自己的 Babel 插件中使用它，从而更加方便自己的代码开发。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/5f02ce4a403f2923b035bda1