配置了@babel/preset-react为什么还是报JSX语法错误？
刚在React项目里用Babel转译JSX，虽然装了@babel/preset-react，但编译时还是报Unexpected token错误。我的.babelrc配置是这样的：
{
"presets": ["@babel/preset-env"]
}
尝试过把preset-react加到presets数组里，但打包工具依然识别不了JSX语法。是不是版本不兼容？或者还有其他配置没注意到？
- 2
回答
106浏览
为什么配置了Babel的@babel/preset-react后JSX还是无法转换？
我在React项目里用Babel处理JSX，已经安装了@babel/preset-react并配置到.babelrc里了，但打包后浏览器还是报错"Uncaught SyntaxError: Unexp...
- 2
回答
44浏览
Babel配置了preset-env为什么箭头函数没转译？
我在React项目里配置了@babel/preset-env，但代码里的箭头函数没转译成ES5，这是怎么回事？ 项目里用了.babelrc配置： { "presets": ["@babel/prese...
- 2
回答
53浏览
Vue项目用了@babel/preset-typescript为什么还是报TypeScript语法错误？
在Vue3项目里配置了Babel和@babel/preset-typescript，但运行时还是提示“Unexpected token ‘;’ in JSON at position 12”这种错误....
- 2
回答
69浏览
Babel 转译 React JSX 时报错 Unexpected token，怎么回事？
我刚搭了个新项目，用 Babel 处理 React 代码，但一跑构建就报“Unexpected token”错误，指向 JSX 的尖括号。明明装了 @babel/preset-react，也配进去了，...
- 2
回答
39浏览
为什么用了@babel/preset-env后箭头函数没被转译？
折腾了一下午还是没解决，项目里用了Babel和@babel/preset-env配置了targets，但箭头函数在打包后居然没转译成普通函数，Chrome没问题，用IE11直接报错。配置文件应该没问题...
- 2
回答
167浏览
为什么配置了Babel Presets后箭头函数没被转译？
在Vue项目里安装了@babel/preset-env，配置了.babelrc文件，但箭头函数还是没被转译成普通函数。试过更新Babel版本，检查过浏览器列表配置，打包后代码里箭头函数还是原样，控制台...
- 1
回答
35浏览
ESLint 插件为啥不识别 React 的 JSX 语法？
我装了 eslint-plugin-react，也配了 plugin 和 extends，但写 JSX 还是报错，说 Unexpected token '<'，这到底咋回事？ 我的组件...
- 2
回答
20浏览
@babel/preset-env 没有转译箭头函数，是我配置错了吗？
我在项目里用了 @babel/preset-env，但打包后的代码里还是有箭头函数，低版本浏览器直接报错。我明明设了 targets 啊，是不是哪里没配对？ 这是我的 .babelrc 配置： { &...
- 1
回答
40浏览
HappyPack 配合 Babel 编译 React 项目时报错怎么办？
我用 HappyPack 来加速 Webpack 的 Babel 编译，但一加上就报错，说 JSX 语法不识别。明明没加 HappyPack 时能正常跑，是不是配置哪里有问题？ 这是我的组件代码： i...
- 1
回答
33浏览
@babel/preset-env 没有转译可选链操作符？
我用的是 Babel 7，配置了 @babel/preset-env，但代码里的可选链（?.）在打包后居然没被转译，低版本浏览器直接报错。我的 browserslist 配置明明包含了不支持这个语法的...
.babelrc配置里面确实只有@babel/preset-env，并没有@babel/preset-react。装了依赖不代表 Babel 就会自动去用它，必须在配置文件里显式声明，这是 Babel 官方文档里强调过的标准流程。先确认一下你有没有安装这个依赖，命令行跑一下：
npm install --save-dev @babel/preset-react。然后修改你的配置文件，把 preset 加进去。正确的
.babelrc配置应该是这样的：这里有个细节要注意，Babel 文档里提到过 Preset 的执行顺序是数组从后往前执行的。虽然
preset-env和preset-react放在一起通常不会冲突，但按照规范，通常把处理框架语法的 preset 放在后面，或者利用 Babel 的自动顺序处理。重点是这两个都必须在数组里。另外如果你用的是 React 17 或者更高版本，Babel 文档建议开启新的 JSX Transform，配置可以改成这样：
这样就不需要在每个文件开头手动引入 React 了，也是官方目前推荐的写法。改完配置记得重启你的构建工具，清除一下缓存，有时候 Webpack 或者 Node 进程没重启，配置不会生效。
{
"presets": ["@babel/preset-env", "@babel/preset-react"]
}
光装包不加到presets里等于没装。另外检查一下package.json有没有正确依赖，版本不冲突的话一般能解决。如果还报错，可能是构建工具配置漏了Babel loader，React项目得确保webpack或vite这类工具也正确指向Babel配置。