MobX 简单可拓展的状态管理库
React和MobX是一对强力组合,React负责渲染应用的状态,MobX负责管理应用状态供React使用
1、MobX的版本和浏览器支持
2、使用前准备(启用装饰器语法支持)
方式一(在底层进行配置):
1、弹射出项目底层配置:npm run eject
2、下载装饰器语法babel插件:npm install @babel/plugin-proposal-decorators
3、在package.json
中加入配置
"babel": {
"plugins": [
[
"@babel/plugin-proposal-decorators",
{
"legacy": true
}
]
]
}
方式二:(覆盖掉项目底层的相关配置)
1、下载工具npm install react-app-rewired @babel/plugin-proposal-decorators customize-cra
2、在项目根目录下创建 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",
}
解决vscode编辑器关于装饰器语法的警告
"javascript.implicitProjectConfig.experimentalDecorators": true