React-MobX错误：“ decorators”插件需要一个“ decoratorsBeforeExport”选项，其值必须为布尔值

问题描述

我收到以下错误消息：如果您是从Babylon / Babel 6迁移的，或者想使用旧的装饰器提案，则应该使用 decorators-legacy插件而不是 decorators。

I get the following error: If you are migrating from Babylon/Babel 6 or want to use the old decorators proposal, you should use the 'decorators-legacy' plugin instead of 'decorators'.

package.json

"@babel/plugin-proposal-decorators": {
      "version": "7.1.2",
      "resolved": "https://registry.npmjs.org/@babel/plugin-proposal-decorators/-/plugin-proposal-decorators-7.1.2.tgz",
      "integrity": "sha512-YooynBO6PmBgHvAd0fl5e5Tq/a0pEC6RqF62ouafme8FzdIVH41Mz/u1dn8fFVm4jzEJ+g/MsOxouwybJPuP8Q==",
      "requires": {
        "@babel/helper-plugin-utils": "^7.0.0",
        "@babel/helper-replace-supers": "^7.1.0",
        "@babel/helper-split-export-declaration": "^7.0.0",
        "@babel/plugin-syntax-decorators": "^7.1.0"
      }
    },

 "@babel/plugin-syntax-decorators": {
      "version": "7.1.0",
      "resolved": "https://registry.npmjs.org/@babel/plugin-syntax-decorators/-/plugin-syntax-decorators-7.1.0.tgz",
      "integrity": "sha512-uQvRSbgQ0nQg3jsmIixXXDCgSpkBolJ9X7NYThMKCcjvE8dN2uWJUzTUNNAeuKOjARTd+wUQV0ztXpgunZYKzQ==",
      "requires": {
        "@babel/helper-plugin-utils": "^7.0.0"
      }
    },

"babel-plugin-syntax-decorators": {
      "version": "6.13.0",
      "resolved": "http://registry.npmjs.org/babel-plugin-syntax-decorators/-/babel-plugin-syntax-decorators-6.13.0.tgz",
      "integrity": "sha1-MSVjtNvePMgGzuPkFszurd0RrAs=",
      "dev": true
    },
    "babel-plugin-transform-decorators-legacy": {
      "version": "1.3.5",
      "resolved": "https://registry.npmjs.org/babel-plugin-transform-decorators-legacy/-/babel-plugin-transform-decorators-legacy-1.3.5.tgz",
      "integrity": "sha512-jYHwjzRXRelYQ1uGm353zNzf3QmtdCfvJbuYTZ4gKveK7M9H1fs3a5AKdY1JUDl0z97E30ukORW1dzhWvsabtA==",
      "dev": true,
      "requires": {
        "babel-plugin-syntax-decorators": "^6.1.18",
        "babel-runtime": "^6.2.0",
        "babel-template": "^6.3.0"
      }
    },
"requires": {
     "@babel/plugin-proposal-decorators": "7.1.2",
}

tsconfig.json

{
    "compilerOptions": {
        "experimentalDecorators": true,
        "allowJs": true
    }
}

推荐答案

错误消息有些混乱，但是有些混乱深度搜索，您可以使用以下方法解决该问题。

The error message is a little bit confusing however with some little bit deep searching, you can resolve it using the following approach.

除了您在本指南中使用的是webpack，我没有做任何假设。

I make no assumptions, except that you are using webpack in this guide.

您需要将babel提案装饰器添加到您的开发依赖项中（您仅在开发期间需要它）（已添加）。

You need to add babel proposal decorators to your dev dependencies (You only need it during dev time) (which you have added already).

如果使用纱线

yarn add --dev @babel/plugin-proposal-decorators 

为npm设置

npm install --save-dev @babel/plugin-proposal-decorators 

然后在您的package.json文件中，找到babel config部分，或者如果不存在则添加一个。配置名称严格是 babel。

then in your package.json file, locate babel config section or add one if not there. The config name is strictly "babel".

  "babel": {
    "presets": [
      "react-app"
    ],
    "plugins": [
      [
        "@babel/plugin-proposal-decorators",
        {
          "legacy": true
        }
      ]
    ]
  }

请特别注意缩进（如果手动输入）。请注意，对象 @ babel / plugin-proposal-decorators 嵌套在两个数组中，因此必须这样工作。

Pay extra attention to the indentation if typing it by hand. notice the object "@babel/plugin-proposal-decorators" is deeply nested inside two arrays, so it has to be as such to work.

只是为了进行健全性检查，您的devDependencies至少应为

and just for sanity check, your devDependencies would at a minimum be as

  "devDependencies": {
    "@babel/plugin-proposal-decorators": "^7.1.2"
  }

现在，您可以使用yarn或npm构建应用程序，并从此过上幸福的生活。

Now you can build your application with either yarn or npm and live happily ever after.

这篇关于React-MobX错误：“ decorators”插件需要一个“ decoratorsBeforeExport”选项，其值必须为布尔值的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！