關于Babel6你需要了解的六件事
在过去的一年中，Babel已经成为将ES2015和JSX转变成枯燥的旧JavaScript的前沿工具。但是看起来在一夜之间，Babel 6改变了一切。 babel包被弃用，运行的babel实际上并没有将ES2015转换成ES5，而且旧的文档基本上已经消失
但不要惊慌！为了让您迅速了解，我列出了六个最重要的变化的简要列表。如果你需要更多的帮助，我的ES6与Babel 6 完全指南将会引导你完成实际的细节;包括CLI，Webpack，Mocha和Gulp。
babel npm软件包不再存在。相反，babel 别被分成多个包：
babel-cli, 其中包含babel命令行界面
babel-core, 其中包含Node API并需要hook
babel-polyfill, 当需要时，您可以使用完整的ES2015-ish环境
为避免意外冲突，请确保从package.json中删除任何以前的Babel包，如babel，babel-core等，然后使用npm将其卸载。
现在每个转换都是一个插件，包括ES2015和JSX。这样的默认情况下不会发生任何事情 - 所以您需要安装正确的插件。实际上，ES2015包含大约_20_插件。你不想手动安装每一个，这就是Babel添加预设的原因。
3. Babel 6添加了预设或插件集合。它为Babel 5中默认提供的功能提供了两个预设：
``` npm install babel-preset-es2015 babel-preset-react --save-dev``` But even after installing a preset, you need to tell Babel to use it.
.babelrc现在还不错。由于Babel默认不再使用ES2015和React转换，因此gulpfile.babel.js和mocha使用的require hook实际上不会做任何事情。通过在您的项目目录中创建一个.babelrc来解决这个问题：
{ "presets": ["es2015", "react"] }Stage 0 现在是一个单独的预设，而不是一个选项。以前，你可以通过设置--stage 0到babel来启用ES7特性，如装饰器和async/await 。现在，您安装并加载babel-preset-stage-0软件包就可以了。
--external-helpers选项现在是一个插件。为避免重复包含Babel的辅助函数，现在需要安装并应用babel-plugin-transform-runtime软件包，然后在代码中需要babel-runtime软件包（是的，即使您使用的是polyfill ）。
现在你已经拥有它了，你现在可以加速Babel 6的packages, plugins, 预设和选项！但是Webpack呢？通过CLI传递预设值怎么样？我试图尽可能简洁地列出这个列表，为此，我把我的完全指南与Babel 6一起保存为一个独立的系列 - 包括CLI，Webpack，Gulp和Mocha。
阅读更多
相关项目
共同學習，寫下你的評論
評論加載中...
作者其他優質文章
