Babel 喜爱 React

February 23, 2015

James Kyle

令人惊讶的事情之一就是 Babel 支持开箱即用的 JSX。

我们会告诉你切换到支持 JSX 的环境是多么容易：

注意：想要使用 Babel 有很多不同的方式，这里只是列出其中一些。 如果你需要列出更加完整的使用方式， 请查看我们的 使用指南 页面。

在浏览器中 (文档)

原先：

<script type='text/jsx'></script>

以后：

<script type='text/babel'></script>

在 Browserify 中 (文档)

原先：

$ browserify -t reactify main.js

以后：

$ browserify -t babelify main.js

在 Node 中 (文档)

原先：

require('node-jsx').install();

以后：

require('babel/register');

在 webpack 中 (文档)

原先：

loaders: [
  { test: /\.js$/, exclude: /node_modules/, loader: 'jsx-loader'}
]

以后：

loaders: [
  { test: /\.js$/, exclude: /node_modules/, loader: 'babel-loader'}
]

在 Gulp 中 (文档)

原先：

gulp.src('views/**/*.js')
    .pipe(jsx())
    .pipe(gulp.dest('dist'));

以后：

gulp.src('views/**/*.js')
    .pipe(babel())
    .pipe(gulp.dest('dist'));

还有很多未列出的，但你现在应该知道配置已经变得简单起来。 如果你没有看到正在寻找的工具，请不要担心， 在 使用指南 页面中完整列出了所有的使用方式。

如果你需要更多设置的帮助， 请务必阅读我们的 JSX 文档， 或者在我们的 聊天支持 中询问其他 Babel 用户。

— 来自 Babel 团队

Recent Posts