Babel在JavaScript开发中的应用

const parse = require('@babel/parser').parse;
const generate = require('@babel/generator').default;
const ast = parse('const a = 111');

traverse(ast, {
  VariableDeclaration: function (path) { //识别在变量声明的时候
    if (path.node.kind === 'const') { //只有const的时候才处理
      console.log(path.node)
      path.replaceWith(
        t.VariableDeclaration('var', // var | let | const
          [
            t.VariableDeclarator(
              t.Identifier("b"), // 变量名
              t.numericLiteral(999) // 变量的值
            )
          ])
      );
    }
    path.skip();
  }
});

let code = generate(ast).code;
console.log(code)

这段代码演示了如何用Babel把const a = 111里面的几个要素逐一替换。把const替换成var，变量名称a替换成b，111替换成999。

在 babel/types 的源码里 lib/definitions/core.js有相关的定义。从下面的代码可以发现VariableDeclaration分成两部分kind和VariableDeclarator。其中kind只能是var，let和const这3个字符串。declarations是一个数组，数组的每个元素都是VariableDeclarator。

defineType("VariableDeclaration", {
  builder: ["kind", "declarations"],
  visitor: ["declarations"],
  aliases: ["Statement", "Declaration"],
  fields: {
    declare: {
      validate: assertValueType("boolean"),
      optional: true,
    },
    kind: {
      validate: chain(
        assertValueType("string"),
        assertOneOf("var", "let", "const"),
      ),
    },
    declarations: {
      validate: chain(
        assertValueType("array"),
        assertEach(assertNodeType("VariableDeclarator")),
      ),
    },
  },
});

VariableDeclarator的定义在下面的代码里有。分成两部分id和init。id就是变量的名称。init对应一个表达式。

defineType("VariableDeclarator", {
  visitor: ["id", "init"],
  fields: {
    id: {
      validate: assertNodeType("LVal"),
    },
    definite: {
      optional: true,
      validate: assertValueType("boolean"),
    },
    init: {
      optional: true,
      validate: assertNodeType("Expression"),
    },
  },
});

在babel里可以这样组装这个VariableDeclarator。id对应t.Identifier("b")，init对应t.numericLiteral(999)

          t.VariableDeclarator(
              t.Identifier("b"), // 变量名
              t.numericLiteral(999) // 变量的值
            )

AST Explorer