@babel/generator

将 AST 转换为代码。

¥Turns an AST into code.

安装

¥Install

npm
Yarn
pnpm

npm install --save-dev @babel/generator

yarn add --dev @babel/generator

pnpm add --save-dev @babel/generator

用法

¥Usage

JavaScript
import { parse } from "@babel/parser";
import generate from "@babel/generator";

const code = "class Example {}";
const ast = parse(code);

const output = generate(
  ast,
  {
    /* options */
  },
  code
);

信息

AST 中不会保留空格或换行符等符号。当 Babel 生成器从 AST 打印代码时，不保证输出格式。

¥The symbols like white spaces or new line characters are not preserved in the AST. When Babel generator prints code from the AST, the output format is not guaranteed.

选项

¥Options

History

版本	变化
v7.22.0	已添加 `importAttributesKeyword`
v7.21.0	已添加 `inputSourceMap`

格式化输出的选项：

¥Options for formatting output:

name	type	default	description
auxiliaryCommentAfter	string		在输出文件末尾添加为块注释的可选字符串
auxiliaryCommentBefore	string		在输出文件开头添加为块注释的可选字符串
comments	boolean	`true`	是否应在输出中包含注释
compact	布尔值或 `'auto'`	`opts.minified`	设置为 `true` 以避免为格式化添加空格
concise	boolean	`false`	设置为 `true` 以减少空格（但不如 `opts.compact`）
decoratorsBeforeExport	boolean		设置为 `true` 以在输出中 `export` 之前打印装饰器。
filename	string		用于警告消息
导入属性关键字	`"with"`、`"assert"` 或 `"with-legacy"`		要使用的导入属性/断言语法。`"with"` 用于 `import "..." with { type: "json" }`，`"assert"` 用于 `import "..." assert { type: "json" }`，`"with-legacy"` 用于 `import "..." with type: "json"`。未指定时，`@babel/generator` 将尝试根据 AST 形状匹配输入代码中的样式。
jsescOption	object		使用 `jsesc` 处理字面量。只有存在 `jsescOption.numbers`（添加到 `v7.9.0`）时，`jsesc` 才会应用于数字。你可以通过传递选项自定义 `jsesc`。
jsonCompatibleStrings	boolean	`false`	设置为 true 以使用 "json" 运行 `jsesc`：true 打印 "\u00A9" 与 "©"；
minified	boolean	`false`	是否应该缩小输出
retainFunctionParens	boolean	`false`	保留函数表达式周围的括号（可用于更改引擎解析行为）
retainLines	boolean	`false`	尝试在输出代码中使用与源代码相同的行号（有助于保留堆栈跟踪）
shouldPrintComment	function	`opts.comments`	如果注释应该包含在输出中，则接受注释（作为字符串）并返回 `true` 的函数。默认情况下，如果 `opts.comments` 是 `true` 或 `opts.minified` 是 `false` 并且注释包含 `@preserve` 或 `@license`，则包含注释
recordAndTupleSyntaxType	`'hash'` 或 `'bar'`	`'hash'`	与 recordAndTuple 令牌一起使用。
topicToken	`'%'` 或 `'#'`		与黑客管道主题参考一起使用的令牌。当有任何 `TopicReference` 个节点时，这是必需的。

源映射选项：

¥Options for source maps:

name	type	default	description
sourceMaps	boolean	`false`	启用生成源映射
输入源映射	字符串或对象		输入源映射
sourceRoot	string		源映射中所有相对 URL 的根
sourceFileName	string		源代码的文件名（即 `code` 参数中的代码）。这仅在 `code` 是字符串时使用。

来自多个来源的 AST

¥AST from Multiple Sources

在大多数情况下，Babel 会进行输入文件到输出文件的 1:1 转换。但是，你可能正在处理由多个来源构建的 AST - JS 文件、模板等。如果是这种情况，并且你希望源映射反映正确的源，则需要将一个对象作为 code 参数传递给 generate。键应该是源文件名，值应该是源内容。

¥In most cases, Babel does a 1:1 transformation of input-file to output-file. However, you may be dealing with AST constructed from multiple sources - JS files, templates, etc. If this is the case, and you want the sourcemaps to reflect the correct sources, you'll need to pass an object to generate as the code parameter. Keys should be the source filenames, and values should be the source content.

这是一个可能看起来像的示例：

¥Here's an example of what that might look like:

JavaScript
import { parse } from "@babel/parser";
import generate from "@babel/generator";

const a = "var a = 1;";
const b = "var b = 2;";
const astA = parse(a, { sourceFilename: "a.js" });
const astB = parse(b, { sourceFilename: "b.js" });
const ast = {
  type: "Program",
  body: [].concat(astA.program.body, astB.program.body),
};

const { code, map } = generate(
  ast,
  { sourceMaps: true },
  {
    "a.js": a,
    "b.js": b,
  }
);

// Sourcemap will point to both a.js and b.js where appropriate.

安装​

用法​

选项​

来自多个来源的 AST​

安装

用法

选项

来自多个来源的 AST