Невозможно использовать mobs decorator, ошибка: поддержка экспериментального синтаксиса decorators-legacy в настоящее время не включена

Question

Я пытаюсь использовать MOBX декораторы, у меня не было проблем с установкой и использованием его с реактивом native, но сейчас я занимаюсь разработкой веб-сайта с использованием библиотеки React.Js, и она выдает мне эту ошибку.

Support for the experimental syntax 'decorators-legacy' isn't currently enabled (25:1):

  23 | 
  24 | 
> 25 | @observer
     | ^
  26 | class Recomended extends Component{
  27 |   constructor(props) {
  28 |     super(props);

Может кто-нибудь, пожалуйста, помогите заставить его работать.

Ниже мой пакет. Json:

{
  "name": "airingbot",
  "version": "0.1.0",
  "private": true,
  "dependencies": {
    "@createjs/tweenjs": "^2.0.0-beta.4",
    "babel-plugin-mobx-deep-action": "^1.6.1",
    "es6-tween": "^5.5.10",
    "mobx": "^5.14.2",
    "mobx-react": "^6.1.4",
    "react": "^16.9.0",
    "react-dom": "^16.9.0",
    "react-scripts": "3.1.2",
    "three-orbit-controls": "^82.1.0"
  },
  "scripts": {
    "start": "react-scripts start",
    "build": "react-scripts build",
    "test": "react-scripts test",
    "eject": "react-scripts eject"
  },
  "eslintConfig": {
    "extends": "react-app"
  },
  "browserslist": {
    "production": [
      ">0.2%",
      "not dead",
      "not op_mini all"
    ],
    "development": [
      "last 1 chrome version",
      "last 1 firefox version",
      "last 1 safari version"
    ]
  },
  "babel": {
    "plugins": [
      "transform-decorators-legacy",
      "@babel/plugin-proposal-decorators",
      {
        "legacy": true
      }
    ],
    "presets": [
      "react-app"
    ]
  },

  "devDependencies": {
    "babel-plugin-transform-decorators-legacy": "^1.3.5"
  }
}

Answer 1

Я думаю, что эти шаги могут помочь добавить поддержку декоратора в приложение React, созданное с помощью create-react-app:

1. npm install --save-dev react-app-rewired babel-plugin-transform-decorators-legacy
2. Заменить react-scripts на react-app-rewired вpackage.json

"scripts": {
  "start": "react-app-rewired start",
  "build": "react-app-rewired build",
  "test": "react-app-rewired test",
  ...
}

Создайте новый файл config-overrides.js в корне проекта и скопируйте следующее содержимое:

const { override, addDecoratorsLegacy } = require('customize-cra')

module.exports = override(addDecoratorsLegacy())