如何在Create-React-App中实现MobX？

问题描述

在学习React和Redux的同时，还告诉我也要了解MobX，因为它要简单得多。我同意，在向我展示时，它会更直观。 但是当我尝试在我的React项目中实现它时，我遇到了很多麻烦，例如使用装饰器，实验性语法警告，并且在修复后遇到了更多麻烦。 而且我无法按照教程进行操作，当我尝试它时，它看起来并不相同，此后便有新版本出现，等等。

安装后：

npm install mobx --save
npm install mobx-react --save

...让我感到困惑的是，使用这两个文件进行进一步的设置（或者我只需要其中之一？）：

.babelrc
babel.config.js

我必须自己创建这些文件（或仅创建其中一个）吗？在哪里？

并且教程还告诉我更改package.json中的babel部分，但是没有这样的部分。 现在，我陷入了编译器（VSCode）错误：

"Support for the experimental Syntax ‘decorators-legacy’ isn’t currently enabled".

我确实运行了命令：

npm install @babel/plugin-proposal-decorators  

..但在VSCode中编译时仍然存在该错误。

解决方法

在MobX 6中，有一个新事物可能会让您完全放弃装饰器，makeAutoObservable：

import { makeAutoObservable } from "mobx"

class Store {
  // Don't need decorators now
  string = 'Test String';

  setString = (string) => {
    this.string = string;
  };

  constructor() {
    // Just call it here
    makeAutoObservable (this);
  }
}

您甚至不需要启用装饰器语法。

更多信息在这里 https://mobx.js.org/migrating-from-4-or-5.html 和 https://mobx.js.org/react-integration.html