Javascript Babel6，仅使用JSX转换，没有其他转换

我想使用，但在一些JSX文件上没有其他转换，目前正在考虑使用一些Javascript，即候选者

如果这些JSX文件包含以下内容，则Transpilation将失败并出现语法错误：

剩余排列运算符

{…x，…y}

异步生成器

异步函数*（）{}

我们的目标是提高现代浏览器中代码的调试能力，因为异步生成器的Babel transpilation似乎特别破坏了Chrome、Firefox的开发工具，即断点停止工作，对

this

的引用失败，

调试器

调用被跳过，以及许多其他观察到的问题

除了使用Babel以上述形式生成JSX之外，似乎没有其他选择——这很好；理想的解决方案是让Babel忽略异步生成器和rest spread操作符（以及它可能引发语法错误的任何其他代码）

编辑 使用Victor建议的插件似乎是正确的解决方案，但在此基础上运行

babel插件语法异步生成器

：

class SearchCriteria {
  async * results (authManager) { }
}

导致错误的原因：

Unexpected token, expected "(" (2:10)
  1 | class SearchCriteria {
> 2 |   *async results(authManager) {
    |          ^

---

，当您添加

语法异步生成器

插件时。

巴贝尔有转换插件和语法插件。转换插件将转换应用于代码。语法插件允许Babel解析特定类型的JavaScript语法，而不是转换它。转换插件将启用相应的语法插件，因此您不必同时指定这两个插件

所以在您的例子中，您需要的是转换插件和两个语法插件：

相应的

.babelrc

将为：

{
  plugins: ["babel-plugin-transform-jsx", "babel-plugin-syntax-async-generators", "babel-plugin-syntax-object-rest-spread"]
}

最小

package.json

：

{
  "name": "babel-jsx",
  "version": "1.0.0",
  "main": "index.js",
  "license": "MIT",
  "scripts": {
    "build": "babel index.js"
  },
  "devDependencies": {
    "babel-cli": "^6.26.0",
    "babel-plugin-syntax-async-generators": "^6.13.0",
    "babel-plugin-syntax-object-rest-spread": "^6.13.0",
    "babel-plugin-transform-jsx": "^2.0.0",
    "react": "^16.4.1"
  }
}

如果在

index.js

中有这样的JavaScript代码：

import React from 'react'

const MyComp = <div>Hello</div>;

async function* myfunc() {
  const array = [1, 2, 3];
  console.log(...array);
}

---

非常感谢维克多。我认为您的想法是正确的，但解决方案没有按预期工作-从编辑后的评论中可以看出。我已将我的解决方案上载到GitHub，您的示例与解决方案配合使用：请看一看谢谢您的及时跟进。我添加了一个问题来说明/记录该问题。进一步讨论请访问：Thanky you@BrianM.Hunt！

$ babel index.js
import React from 'react';

const MyComp = {
  elementName: 'div',
  attributes: {},
  children: ['Hello']
};

async function* myfunc() {
  const array = [1, 2, 3];
  console.log(...array);
}