跳至主要内容

@babel/cli

Babel 自带一个内置的 CLI，可以用来从命令行编译文件。

此外，各种入口点脚本位于顶级包的 @babel/cli/bin 中。这里有一个可执行的 shell 脚本 babel-external-helpers.js，以及 Babel 的主 CLI 脚本 babel.js。

安装​

虽然你*可以*在你的机器上全局安装 Babel CLI，但最好是为每个项目本地安装。

这主要有两个原因。

  1. 同一台机器上的不同项目可以依赖不同版本的 Babel，允许你单独更新它们。
  2. 不依赖于你正在工作的环境，会使你的项目更容易移植和设置。

我们可以通过运行以下命令来本地安装 Babel CLI

npm install --save-dev @babel/core @babel/cli
注意

如果你没有 package.json 文件，请在安装前创建一个。这将确保与 npx 命令的正常交互。

安装完成后，你的 package.json 文件应该包含

{
  "devDependencies": {
+   "@babel/cli": "^7.0.0",
+   "@babel/core": "^7.0.0"
  }
}

用法​

注意

请先安装 @babel/cli 和 @babel/core，然后再使用 npx babel，否则 npx 会安装过时的 babel 6.x 版本。除了 npx 之外，你也可以把它放在 npm run 脚本 中，或者你可以使用相对路径来执行。./node_modules/.bin/babel

Shell
npx babel script.js
Shell
npx babel --help

编译文件​

编译文件 script.js 并输出到标准输出。

Shell
npx babel script.js
# output...

如果你想输出到文件，可以使用 --out-file 或 -o。

Shell
npx babel script.js --out-file script-compiled.js

要在你每次更改文件时编译文件，请使用 --watch 或 -w 选项。

Shell
npx babel script.js --watch --out-file script-compiled.js

使用源代码地图编译​

注意

从 v7.19.3 版本开始，如果没有指定此参数，@babel/cli 将遵循 配置文件。

如果你想添加一个源代码地图文件，可以使用 --source-maps 或 -s。

Shell
npx babel script.js --out-file script-compiled.js --source-maps

或者，如果你想使用内联源代码地图，请使用 --source-maps inline。

Shell
npx babel script.js --out-file script-compiled.js --source-maps inline

编译目录​

使用 --out-dir 或 -d 编译整个 src 目录并将其输出到 lib 目录。这不会覆盖 lib 中的任何其他文件或目录。

Shell
npx babel src --out-dir lib

编译整个 src 目录并将其输出为一个连接的文件。

Shell
npx babel src --out-file script-compiled.js

包含 TypeScript 文件的目录​

使用 --extensions 选项来指定 Babel 在编译整个 src 目录时应该处理哪些文件扩展名。默认的 --extensions 可以从 Babel.DEFAULT_EXTENSIONS 中获取。

Shell
npx babel src --out-dir lib \
  --extensions .ts,.js,.tsx,.jsx,.cjs,.mjs \
  --presets=@babel/preset-typescript,@babel/preset-env,@babel/preset-react

忽略文件​

忽略 spec 和 test 文件

Shell
npx babel src --out-dir lib --ignore "src/**/*.spec.js","src/**/*.test.js"

复制文件​

复制不会被编译的文件

Shell
npx babel src --out-dir lib --copy-files

如果你不想复制被忽略的 JavaScript 文件

历史记录
版本更改
v7.8.0添加了 --copy-ignored
v7.8.4将 copyeIgnored 选项的默认值更改为 true，可以使用 --no-copy-ignored 禁用它
Shell
npx babel src --out-dir lib --copy-files --no-copy-ignored

管道文件​

通过标准输入管道输入一个文件，并将其输出到 script-compiled.js

Shell
npx babel --out-file script-compiled.js < script.js

使用插件​

使用 --plugins 选项来指定在编译中使用的插件

Shell
npx babel script.js --out-file script-compiled.js --plugins=@babel/transform-class-properties,@babel/transform-modules-amd

使用预设​

使用 --presets 选项来指定在编译中使用的预设

Shell
npx babel script.js --out-file script-compiled.js --presets=@babel/preset-env,@babel/flow

使用配置文件​

忽略 .babelrc.json 或 .babelrc​

忽略项目 .babelrc 或 .babelrc.json 文件中的配置，并使用 CLI 选项，例如用于自定义构建

Shell
npx babel --no-babelrc script.js --out-file script-compiled.js --presets=@babel/preset-env,@babel/preset-react

自定义配置路径​

Shell
npx babel --config-file /path/to/my/babel.config.json --out-dir dist ./src

有关配置文件的更多信息，请参见此处。

设置文件扩展名​

添加于：v7.8.0

默认情况下，编译后的文件将使用 .js 扩展名。

你可以使用 --out-file-extension 控制输出文件的扩展名

Shell
npx babel src --out-dir lib --out-file-extension .mjs

你也可以使用 --keep-file-extension 保留输入文件的扩展名

Shell
npx babel src-with-mjs-and-cjs --out-dir lib --keep-file-extension

请注意，--keep-file-extension 和 --out-file-extension 不能一起使用。

高级用法​

还有很多其他选项可用，请参阅选项、babel --help 和其他部分以获取更多信息。