3

我正在尝试使用 npm start commamnd 运行我的反应应用程序并安装了@babel/preset-react 和@babel/plugin-syntax-jsx。但我正在运行这个反应应用程序得到以下错误。

当前未启用对实验语法“jsx”的支持 (7:9):

   6 | const PostCodeLookup = props => {
>  7 |  return <PostcodeLookup {...props} />
     |         ^
   8 |
   9 | };
  

将 @babel/preset-react ( https://git.io/JfeDR ) 添加到 Babel 配置的“预设”部分以启用转换。如果您想保持原样,请将 @babel/plugin-syntax-jsx ( https://git.io/vb4yA ) 添加到“插件”部分以启用解析。

4

2 回答 2

1

正如 jaybhatt 之前所说,如果不了解您如何引导您的应用程序,就很难说清楚。

如果你使用 react-create-app 可能你弄乱了包并最终处于不一致的状态。尝试重置您的应用程序。在另一个文件夹上创建一个应用程序并迁移您的代码有一个选项(我做了几次:)!)。

如果您“手动”创建了应用程序结构,请检查您是否在 webpack 配置中也设置了“@babel/preset-react”:

rules: [
  {
    test: /\.(js|jsx)$/,
    exclude: /(node_modules|bower_components)/,
    loader: 'babel-loader',
    options: { presets: ['@babel/env', '@babel/preset-react'] },
  },
于 2021-10-21T04:45:49.297 回答
0
  • 你能说出你从哪里引导你的应用程序吗?(创建 React App 或类似的东西?)
  • 此外,您需要有一个包含这些内容的.babelrcorbabel.config.js(on)文件,仅安装软件包是行不通的。

下面举一个例子来说明你的babel.config.json样子。如果您使用它,请从下面的示例中删除任何额外的插件。

{
    "presets": [
      [
        "@babel/preset-env",
        {
          "modules": false,
          "targets": {
            "node": "current"
          }
        }
      ],
      "@babel/preset-react"
    ],
    "env": {
      "test": {
        "presets": [
          "@babel/preset-env",
          "@babel/preset-react"
        ],
        "plugins": [
          [
            "@babel/plugin-proposal-class-properties",
            {
              "spec": true
            }
          ]
        ]
      }
    },
    "plugins": [
      [
        "@babel/plugin-proposal-class-properties",
        {
          "spec": true
        }
      ],
      "@babel/plugin-proposal-object-rest-spread"
    ]
  }
  
于 2021-05-14T10:01:09.527 回答