web-dev-qa-db-fra.com

Erreur React-MobX: le plugin 'decorators' nécessite une option 'decoratorsBeforeExport' dont la valeur doit être un booléen

Je reçois le message d'erreur suivant: Si vous migrez de Babylon/Babel 6 ou souhaitez utiliser l'ancienne proposition de décorateurs, vous devez utiliser le plug-in 'décorators-legacy' à la place de 'décorateurs'.

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
    }
}
reactjsdecoratormobx-react
7
KNIGHT MAHAJAN

Le message d'erreur est un peu déroutant, mais avec une recherche un peu approfondie, vous pouvez le résoudre en utilisant l'approche suivante.

Je ne fais aucune hypothèse, sauf que vous utilisez Webpack dans ce guide.

Vous devez ajouter des décorateurs de propositions babel à vos dépendances de dev (vous n’en avez besoin que pendant le temps de développement) (que vous avez déjà ajoutés).

si vous utilisez du fil

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

autre pour npm

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

puis, dans votre fichier package.json, localisez la section babel config ou ajoutez-en une sinon. Le nom de la configuration est strictement "babel". 

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

Portez une attention particulière à l'indentation si vous le tapez à la main. remarquez que l'objet "@babel/plugin-proposal-decorators" est profondément imbriqué dans deux tableaux, il doit donc être en tant que tel pour fonctionner. 

et juste pour vérifier votre santé mentale, vos devDependencies seraient au minimum aussi 

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

Vous pouvez maintenant créer votre application avec narn ou npm et vivre heureux pour toujours. 

9
Mpho Shaun Majenge
{
 "presets": ['@babel/preset-env', '@babel/preset-react'],
 "plugins": [
  ["import", { "libraryName": "antd", "libraryDirectory": "es", "style": "less" }],
  [
    "@babel/plugin-proposal-decorators",
    {
      "decoratorsBeforeExport":true
    }
  ]
 ]
}
1
李海双
"babel": {
   "presets": [
     "react-app"
   ],
  "plugins": [
  [
    "@babel/plugin-proposal-decorators",
    {
      "legacy": true
    }
  ],
  [
    "@babel/plugin-proposal-class-properties",
    {
      "loose": true
    }
   ]
  ]
 },
 "devDependencies": {
 "@babel/plugin-proposal-decorators": "^7.3.0"
}
0
sergey andriyaka