Babel配置了preset-env为什么箭头函数没转译?

Designer°乙涵 阅读 17

我在React项目里配置了@babel/preset-env,但代码里的箭头函数没转译成ES5,这是怎么回事?

项目里用了.babelrc配置:


{
  "presets": ["@babel/preset-env"]
}

已经安装了@babel/core和preset-env,目标浏览器是IE11。但编译后的代码里箭头函数依然存在,其他ES6语法倒是转了。是不是少了什么插件?

我来解答 赞 2 收藏
二维码
手机扫码查看
1 条解答
南宫素香
你这个问题是因为 @babel/preset-env 默认只会转译那些目标浏览器不支持的语法,而箭头函数在某些情况下可能被认为“可被支持”,所以它没被转译。你需要明确指定目标浏览器是 IE11,并确保配置正确。

代码放这了,修改你的 .babelrc 配置:

{
"presets": [
["@babel/preset-env", {
"targets": {
"ie": "11"
}
}]
]
}


另外,如果你用的是 React,默认的 JSX 转译不会处理箭头函数,所以确保你装了 @babel/preset-react 并且也加到 presets 里。完整的配置应该是这样的:

{
"presets": [
["@babel/preset-env", {
"targets": {
"ie": "11"
}
}],
"@babel/preset-react"
]
}


最后别忘了重启构建工具,有时候缓存会让你怀疑人生。如果还是不行,检查下是不是有其他插件或者工具链冲突了,比如 Webpack 的 loader 配置。我以前就被坑过好几次,真是烦。
点赞 1
2026-02-16 17:02