插件的使用
自己组合插件
使用预设的插件
官方 Preset ---> 一些常用环境编写的 preset (社区维护的,通过npm下载)
@babel/preset-env
@babel/preset-flow
@babel/preset-react
@babel/preset-typescript
创建自己的 presets
创建一个自己的 preset,只需导出一份配置即可。
可以是一份插件数组:
module.exports = function() {
return {
plugins: [ "pluginA", "pluginB", "pluginC", ]
};
}
preset 可以包含其他的 preset,以及带有参数的插件。
module.exports = () => ({ presets: [ require("@babel/preset-env"), ], plugins: [ [require("@babel/plugin-proposal-class-properties"), { loose: true }], require("@babel/plugin-proposal-object-rest-spread"), ], });
Preset 路径
npm,自动检查 node-modules 是否安装
{ "presets": ["babel-preset-myPreset"] }
指向 preset 的绝对或相对路径
{ "presets": ["./myProject/myPreset"] }
Preset 的短名称
如果 preset 名称的前缀为 babel - preset - ,你还可以使用它的短名称 (plugin 前缀babel-plugin-, 只写它的短名称 )
{ "presets": [ "myPreset", "babel-preset-myPreset" // equivalent ] }
{ "presets": [ "@org/babel-preset-name", "@org/name" // equivalent ] }
Preset 的参数 ----> 与plugin相同
附加说明:
Polyfills ----> 通过引入 @babel/polyfill 来满足 Babel 功能的所有需求
Babel6 的核心是插件
(改天再写吧, 不行了。 有没有讲 babel 的视频 推荐下。。。)