create-react-app + mobx其中@observer装饰器报错

Question

用官方脚手架搭建项目，用到mobx里面的 装饰器会报错，工具是webstorm，怎么处理？

我在网上找的是要npm i --save-dev babel-plugin-transform-decorators-legacy
需要编辑.babelrc 文件但是默认是找不到的，需要运行 eject，我运行eject命令之后，项目就彻底报错启动不起来了，貌似提示要更新什么，但是不成功。想问问有什么其他的解决办法吗

Answer 1

npm install --save-dev babel-plugin-transform-decorators-legacy

然后在node_modules/babel-preset-react-app/index.js plugins中添加
require.resolve('babel-plugin-transform-decorators-legacy')

Answer 2

有两种方式：
1.运行eject修改，就是1楼所说的方式，不再赘述
2.使用react-app-rewired，如下

npm install  customize-cra react-app-rewired @babel/plugin-proposal-decorators --save

项目根目录新建config-overrides.js文件加入以下代码:

const { override, addDecoratorsLegacy } = require('customize-cra');
module.exports = override(
 addDecoratorsLegacy()
 );

修改package.json文件如下：

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

重启就可以了

Answer 3

https://github.com/timarney/r...

Answer 4

在create-react-app中使用装饰器

create-react-app ExampleApp
npm run eject

//非react
npm install --save-dev babel-plugin-transform-decorators-legacy

//针对react
npm install babel-preset-stage-2 --save-dev
npm install babel-preset-react-native-stage-0 --save-dev
npm install --save mobx mobx-react

根目录下创建.babelrc

// react
{
  "presets": ["react-native-stage-0/decorator-support"]
}

// 非react
{
  "presets": [
    "es2015",
    "stage-1"
  ],
  "plugins": ["transform-decorators-legacy"]
}