Babel插件，提案装饰器无法按预期运行

Question

我在package.json中添加了这两个devDependencies：

"@babel/plugin-proposal-class-properties": "^7.1.0",
"@babel/plugin-proposal-decorators": "^7.1.6",

在.babelrc文件中，我将它们添加为插件：

{
    "presets": ["module:metro-react-native-babel-preset"],
    "plugins": [
        ["@babel/plugin-proposal-decorators", { "legacy": true}],
        ["@babel/plugin-proposal-class-properties", { "loose": true}]
    ]
}

我正在使用mobx，因此干净的语法可以观察到，我的文件如下所示：

class AppStore {
  @observable username = ''
}

export default (new AppStore())

但是它总是显示此错误：

我认为我已经正确地完成了操作，但是无法检测到babel插件是否已加载。

Answer 1

首先，请确保您使用的是最新版本的metro-react-native-babel-preset，他们仅在9天前发布了新的未成年人0.50.0。

如果这没有帮助，则问题可能出在以下事实：metro-react-native-babel-preset already includes类属性插件，并且您知道插件matter的顺序， 您需要在类属性插件之前运行装饰器。

关于使用babel进行订购这一主题进行了很多讨论，尽管插件应该在预设之前运行，但仍然would be a problem。不幸的是，PR #5735添加插件订购功能的工作仍在进行中。

同时，您可以做的是要么叉起您自己的metro-react-native-babel-preset，然后在我所指向的类属性插件之前添加装饰器插件。您还可以尝试按正确的顺序制作自己的babel预设（包括两个插件），并将其添加到Metro一个之后，因为预设以相反的顺序加载，从here到倒数第一。

另外值得一试的是使用yarn start --reset-cache启动打包程序，这可能会解决由错误的缓存/过期的缓存引起的问题。