如何用babel将ES6转换

Babel 把用最新标准编写的 JavaScript 代码向下编译成可以在今天随处可用的版本。 这一过程叫做“源码到源码”编译， 也被称为转换编译。

通俗的说，就是我们可以用ES6, ES7等来编写代码，Babel会把他们统统转为ES5。

• babel-core 调用Babel的API进行转码
• babel-loader 用来告诉webpack我想要对我的js代码进行兼容性编译，起到一个通知者角色
• babel-preset-env 用于解析 ES6
• babel-preset-react 用于解析 JSX
• babel-preset-stage-0 用于解析 ES7 提案

npm install --save-dev babel-core babel-loader babel-preset-env babel-preset-react babel-preset-stage-0

创建.babelrc

//.babelrc {"presets":["react","env","stage-0"] } {test:/(\.jsx|.js)$/,use:{loader:'babel-loader',options:{// babel-loader 将使用默认的缓存目录node_modules/.cache/babel-loader,之后的 webpack 构建，将会尝试读取缓存，来避免在每次执行时，可能产生的、高性能消耗的 Babel 重新编译过程cacheDirectory:true}},exclude:/node_modules/,include: path.join(__dirname, 'src')

总结

以上是生活随笔为你收集整理的如何用babel将ES6转换的全部内容，希望文章能够帮你解决所遇到的问题。

如果觉得生活随笔网站内容还不错，欢迎将生活随笔推荐给好友。