`babel-preset-react` 不使用 gulp 转换 jsx

Posted 2023-02-21

【中文标题】`babel-preset-react` 不使用 gulp 转换 jsx

【英文标题】：`babel-preset-react` not transforming jsx with gulp

【发布时间】：2016-08-30 22:37:16

【问题描述】：

无论我尝试什么，<div/> 之类的内容都不会转换为 React.createClass，并且浏览器显然会在我的代码中的第一个 < 上卡住。

我正在使用 gulp：

  return gulp.src(files)
     .pipe(babel(
        presets: [ "react", "es2015" ],
        plugins: [ "transform-react-jsx" ]          
      ))
     .pipe(gulp.dest(dest));

我尝试过使用和不使用 transform-react-jsx，因为我相信 react 预设也应该转换 jsx？

这是我的.babelrc，但它似乎没有任何区别，我在某处读到在某些情况下您需要删除它才能工作。试过了，没用。

    "presets": [ "react", "es2015" ],
    "plugins": ["transform-react-jsx"]

在我的 package.json 中：

"babel": "^6.5.2",
"babel-cli": "^6.8.0",
"babel-plugin-transform-react-jsx": "^6.8.0",
"babel-preset-es2015": "~6.5.0",
"babel-preset-react": "^6.5.0",
"gulp-babel": "~6.1.2",
...

我几乎尝试过任何方法，但它只是无法转换我的代码

【参考方案1】：

显然，在两者之间有一个gulp-changed 步骤破坏了它。删除它为我修复了它。

您可能会认为它“能够检测流中的文件是否已更改”，就像文档所说的那样，但我想情况并非如此。