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

人已赞赏
前端

[react]npm install 提示权限不足 Error: EPERM: operation not permitted, unlink XXX 【解决办法】

2020-11-9 12:03:59

前端

[react]mobx 6 视图更新 mobx props更新页面不渲染【解决办法】

2020-11-9 12:07:57

0 条回复 A文章作者 M管理员
    暂无讨论,说说你的看法吧
'); })();