使用 Babel (PhpStorm) 的 ES6 Transpile 错误答案

【问题标题】：ES6 Transpile error using Babel (PhpStorm)使用 Babel (PhpStorm) 的 ES6 Transpile 错误
【发布时间】：2019-03-15 19:00:56
【问题描述】：

我的 Babel 文件观察器的 PhpStorm 中出现以下编译错误：

    cmd.exe /D /C call "C:/Program Files/nodejs/babel.cmd" wp-content\plugins\scorch_gutenberg\blocks.js --out-dir dist --presets=es2015
SyntaxError: wp-content/plugins/scorch_gutenberg/blocks.js: Unexpected token (12:15)
  10 | 
  11 |     edit() {
> 12 |         return <p style={ blockStyle }>Hello editor.</p>;
     |                ^
  13 |     },
  14 | 
  15 |     save() {

Process finished with exit code 1

基本上看起来它无法识别 ES6 语法。我已经按照 Babel 网站安装了 es2015 预设，我看到的唯一错误是这个 Synax 错误，所以不确定我是否遗漏了一些明显的东西，因为我真的是一个 PHP 开发人员。

任何帮助都会很棒，或者如果其他人拥有最新版本的 PhpStorm 并为此设置了转译器。

【问题讨论】：

标签： ecmascript-6 phpstorm webstorm babeljs gutenberg-blocks

【解决方案1】：

它无法识别 JSX 语法（return <p style={ blockStyle }>Hello editor.</p> 是 JSX）。您需要安装babel-preset-react 并将其添加到预设中

【讨论】：