Блог

я пытаюсь запустить свое приложение react с помощью npm start commamnd и установил как @babel/preset-react, так и @babel/plugin-синтаксис-jsx. но я запускаю это приложение react, получая следующую ошибку.

Поддержка экспериментального синтаксиса » jsx » в настоящее время не включена (7:9):

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

Добавить @babel/предустановку-реагировать (https://git.io/JfeDR) в раздел «Настройки» вашей конфигурации Babel, чтобы включить преобразование.
Если вы хотите оставить все как есть, добавьте @babel/плагин-синтаксис-jsx (https://git.io/vb4yA) в раздел «плагины», чтобы включить синтаксический анализ.

Трудно сказать, не зная, как вы загрузили свое приложение, как уже говорил Джейбхатт.

Если вы использовали react-create-приложение, вероятно, вы перепутались с пакетами и оказались в несогласованном состоянии. Попробуйте сбросить свое приложение. Создание приложения в другой папке и перенос кода есть возможность (я делал это пару раз 🙂 !).

Если вы создали структуру приложения «вручную», проверьте, установлен ли у вас «@babel/preset-react» также в конфигурации webpack:

 rules: [
  {
    test: /.(js|jsx)$/,
    exclude: /(node_modules|bower_components)/,
    loader: 'babel-loader',
    options: { presets: ['@babel/env', '@babel/preset-react'] },
  },
 

• Можете ли вы сказать, откуда вы загрузили свое приложение? (Создать приложение React или что-то в этом роде?)
• Кроме того, вам нужно иметь .babelrc babel.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"
    ]
  }