react项目中报错 Support for the experimental syntax ‘jsx‘ isn‘t currently enabled
时间: 2024-10-17 21:13:13 浏览: 5
在React项目的开发过程中,如果遇到 "Support for the experimental syntax 'jsx' isn't currently enabled" 这样的错误,通常意味着你在代码中使用了ES6的JSX语法,但Babel这个用于转换JavaScript源码到兼容旧浏览器版本的工具没有正确配置来处理 JSX 。
JSX 是一种 React 的专用语法扩展,它使得HTML的元素和属性看起来像JavaScript那样编写。解决这个问题,你需要检查以下几个步骤:
1. 确保已经安装了 Babel 和相关的插件,如 @babel/preset-react,这可以帮助转译JSX。
```
npm install --save-dev @babel/core @babel/cli @babel/preset-env @babel/preset-react
```
2. 配置 .babelrc 或者 package.json 文件中的babel配置,添加对 JSX 支持。例如,在`.babelrc`文件中加入:
```json
{
"presets": ["@babel/preset-env", "@babel/preset-react"]
}
```
3. 如果你是通过创建新的React应用(如使用create-react-app),检查`config-overrides.js`或`babel.config.js`等配置文件是否已启用jsx支持。
4. 如果使用Webpack或其他构建工具,请确保它们也包含了对Babel的支持,并配置好针对JSX的规则。
5. 重启开发服务器,让配置生效。
阅读全文