mobx的安装与配置 【详细流程】

今天爱分享给大家带来mobx的安装与配置 【详细流程】，希望能够帮助到大家。

1、用create-react-app搭好项目
2、用npm下载mobx和mobx-react（这个是用来连接mobx和react的）
3、要玩mobx，可以用原生写，挺复杂的（不推荐）。es6提供了装饰器，这种写法相对来说更简便。很不幸的是，create-react-app 目前还没有内置的装饰器支持，得自己去下载第三方插件手动配置。
4、npm下载插件：npm i @babel/plugin-proposal-decorators -D
5、下载好了，自己要手动去package.json里面babel那里配置。因为上面那个是babel开头的。但是你打开你创建的那个项目，package.json文件中没有babel这个东西。因为官方做这个脚手架，不想让你动他配置，给隐藏了。这里还不止babel被隐藏了，还有其他东西。
6、用npm run eject 可以将这些原本的配置一一显示出来。但是，你直接输这个命令，会报错。要做下面一系列操作。

7、(1)、

 git init  

（2）、

git add .

(3) 、

git commit -m “save before init”

8、做完这一步，再输入npm run eject 成功。现在打开package.json就可以发现比之前的更复杂了，找到babel。继续上面的第5步，配置babel。
9、把下面这个复制替换之前的babel，就成功了。

"babel": {
 "plugins": [
   [
     "@babel/plugin-proposal-decorators",
     {
       "legacy": true
     }
   ]
 ],
 "presets": [
   "react-app"
 ]
}

10、写这个时候的版本：
React： 17.0.1
mobx: 6.0.2
mobx-react：7.0.0