在 create-react-app 中使用 MobX 可观察装饰器

本文介绍了在 create-react-app 中使用 MobX 可观察装饰器的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！

问题描述

MobX 文档告诉我我必须使用转换插件 transform-decorators-legacy 并确保它在插件列表中排在第一位"，以便装饰器工作.MobX 样板项目建议我需要一个 .babelrc 像:

The MobX docs tell me I must "use the transform plugin transform-decorators-legacy and make sure it is first in the plugins list", in order for the decorators to work. The MobX boilerplate project suggests I need a .babelrc like:

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

如何使用 create-react-app 生成的项目执行此操作?任何尝试使用 @ 装饰器的错误.即使在项目被弹出"之后也没有 .babelrc .

How do I do that with a create-react-app generated project? Any attempt to use @ decorators errors. There is no .babelrc even after the project is 'ejected'.

推荐答案

你不能使用装饰器语法，除非你eject.然而，你可以在没有 @ 的情况下使用 MobX，因为它只是一个语法糖.

You can not use decorator syntax unless you eject. However, you can use MobX without @ since it is just a syntax sugar.

Dan Abramov 已经阐明了原因

Dan Abramov has articulated the reason for this

我们的立场很简单:我们添加稳定的变换足够(如 async/await)或被 Facebook 大量使用(如 class特性).只有这样我们才能有信心提出建议，因为如果标准发生变化，我们将编写和发布一个代码模块来远离他们.

由于我们目前不使用装饰器，我们不接受它如果标准成为我们自己提供的迁移路径不相容.此外，装饰器甚至不受官方支持by Babel(-legacy 是有原因的).当它们被配置时人们稍微错误地责怪 React.

Since we don’t currently use decorators, we don’t take it upon ourselves to provide a migration path if the standard becomes incompatible. Additionally decorators aren’t even officially supported by Babel (-legacy is there for a reason). And when they are configured slightly incorrectly people blame React.

您可能还想查看 create-react-app-mobx

You also might want to look into create-react-app-mobx