配置了@babel/preset-react为什么还是报JSX语法错误? 令狐瑞芳 提问于 2026-02-07 13:11:37 阅读 15 工具 刚在React项目里用Babel转译JSX,虽然装了@babel/preset-react,但编译时还是报Unexpected token错误。我的.babelrc配置是这样的: { "presets": ["@babel/preset-env"] } 尝试过把preset-react加到presets数组里,但打包工具依然识别不了JSX语法。是不是版本不兼容?或者还有其他配置没注意到? Babel 我来解答 赞 3 收藏 分享 生成中... 手机扫码查看 复制链接 生成海报 反馈 发表解答 您需要先 登录/注册 才能发表解答 1 条解答 俊俊 ☘︎ Lv1 JSX报错大概率是Babel没正确处理React语法。既然你已经装了@babel/preset-react,那问题应该出在配置没生效。你当前的.babelrc只用了preset-env,没包含preset-react,需要改成这样: { "presets": ["@babel/preset-env", "@babel/preset-react"] } 光装包不加到presets里等于没装。另外检查一下package.json有没有正确依赖,版本不冲突的话一般能解决。如果还报错,可能是构建工具配置漏了Babel loader,React项目得确保webpack或vite这类工具也正确指向Babel配置。 回复 点赞 6 2026-02-07 13:13 加载更多 相关推荐 2 回答 42 浏览 为什么配置了Babel的@babel/preset-react后JSX还是无法转换? 我在React项目里用Babel处理JSX,已经安装了@babel/preset-react并配置到.babelrc里了,但打包后浏览器还是报错"Uncaught SyntaxError: Unexp... FSD-倩云 工具 2026-02-05 06:23:27 1 回答 18 浏览 Babel配置了preset-env为什么箭头函数没转译? 我在React项目里配置了@babel/preset-env,但代码里的箭头函数没转译成ES5,这是怎么回事? 项目里用了.babelrc配置: { "presets": ["@babel/prese... Designer°乙涵 工具 2026-02-16 16:33:25 2 回答 31 浏览 Vue项目用了@babel/preset-typescript为什么还是报TypeScript语法错误? 在Vue3项目里配置了Babel和@babel/preset-typescript,但运行时还是提示“Unexpected token ‘;’ in JSON at position 12”这种错误.... UX炳錦 工具 2026-01-25 20:59:23 1 回答 15 浏览 为什么用了@babel/preset-env后箭头函数没被转译? 折腾了一下午还是没解决,项目里用了Babel和@babel/preset-env配置了targets,但箭头函数在打包后居然没转译成普通函数,Chrome没问题,用IE11直接报错。配置文件应该没问题... Mr-金利 工具 2026-02-15 11:48:25 2 回答 127 浏览 为什么配置了Babel Presets后箭头函数没被转译? 在Vue项目里安装了@babel/preset-env,配置了.babelrc文件,但箭头函数还是没被转译成普通函数。试过更新Babel版本,检查过浏览器列表配置,打包后代码里箭头函数还是原样,控制台... 慕容艳苹 工具 2026-02-06 02:00:31 2 回答 41 浏览 自定义Webpack Loader处理React JSX时语法错误怎么办? 我在写一个自定义Webpack Loader来处理React组件的JSX代码,但总是报"Unexpected token (2:8)"错误。尝试用babylon解析时发现,Loader返回的代码字符串... 西门卓尚 前端 2026-02-01 21:37:26 2 回答 37 浏览 Babel插件遍历React组件时如何修改props默认值? 我在用Babel插件处理React组件时遇到问题,想通过AST修改组件默认props,但总报错。比如这个组件: class MyComponent extends React.Component { ... 端木焕焕 工具 2026-02-05 14:44:34 2 回答 13 浏览 为什么我的Babel配置无法转换ES6箭头函数? 大家好,我在项目里用了Babel转码,但箭头函数一直没被转成ES5语法。配置文件和代码都检查了好几遍,但还是不行... 我的.babelrc配置是这样写的: { "presets": ["@babel... Newb.玉曼 工具 2026-02-18 09:00:37 2 回答 17 浏览 Babel配置后箭头函数没转成普通函数,旧版浏览器报错怎么办? 我在项目里用了箭头函数写组件方法,按照教程安装了@babel/preset-env并配置了.babelrc: { "presets": ["@babel/preset-env"] } 但打包后代码里箭... 萌新.文雅 工具 2026-02-15 13:24:30 2 回答 10 浏览 为什么配置了Babel插件后类属性还是报语法错误? 在写React组件时用了类属性语法:class MyClass { state = {} },按照文档装了@babel/plugin-proposal-class-properties,并在.babe... 设计师娇娇 工具 2026-02-15 10:32:27
{
"presets": ["@babel/preset-env", "@babel/preset-react"]
}
光装包不加到presets里等于没装。另外检查一下package.json有没有正确依赖,版本不冲突的话一般能解决。如果还报错,可能是构建工具配置漏了Babel loader,React项目得确保webpack或vite这类工具也正确指向Babel配置。