在使用create-react-app创建的项目中配置mobx

第一步

正常创建项目

第二步

安装依赖

//使用yarn
yarn add react-app-rewired 
yarn add customize-cra 
yarn add @babel/plugin-proposal-decorators
yarn add @babel/plugin-proposal-decorators
//使用npm
npm install react-app-rewired
npm install customize-cra @babel/plugin-proposal-decorators

第三步

替换package.json中的scripts内容

//替换后的样子
"scripts": {
    "start": "react-app-rewired start",
    "build": "react-app-rewired build",
    "test": "react-app-rewired test",
    "eject": "react-app-rewired eject"
  }

第四步

在项目的根目录下新建文件config-overrides.js,内容如下:

const {
   override,
   addDecoratorsLegacy,
   disableEsLint,
 } = require("customize-cra");
 
module.exports = {
   webpack: override(
     addDecoratorsLegacy(),
     disableEsLint(),
   )
};

第五步:注解在js文件中引起报红解决办法

在项目的根目录下创建jsconfig.js文件
内容如下

{
  "compilerOptions": {
    "module": "commonjs",
    "target": "es6",
    "experimentalDecorators": true
  },
  "include": ["src/**/*"]
}