babel-cli
: 在 命令行 下使用 Babel 编译文件的方式babel-register
:将 文件引入 至项目就可以运行 Babel 的方式babel-core
:以 编程 的方式使用 Babel,可以获取 AST
babel/parser
: 将源代码解析成 ASTbabel/generator
: 将 AST 解码生成新代码babel/traverse
: 用来遍历 AST 进行编辑操作babel-polyfill
: 对新的 API 进行编译,实现向下兼容babel-plugin-transform-runtime
:按需引入 polyfill
默认情况下 babel
什么都不会做,仅仅是代码的搬运工,所以需要用配置告诉它干些什么
.babelrc
{
// 预设,就是已经内置了很多相关配置项
"presets": [
// 插件的命名方式 babel-preset-*, 比如 babel-preset-es2015
// 引入方式使用后缀即可
"es2015", // 用来将代码编译成 ES5
"react",
"stage-2" // 提案阶段,stage-4 阶段为已采纳阶段,未来将会成为标准,会在 es2015 中
],
"plugins": [],
"parser": "babel-eslint" // 静态分析工具
}
babel src -d lib # babel 将 src 目录下所有的内容结合 .babelrc 的配置,打包到 lib 目录下
中文官网:https://www.babeljs.cn/docs/babel-preset-flow
阮一峰 Babel:https://www.ruanyifeng.com/blog/2016/01/babel.html