Ошибка React-MobX: плагину 'декораторы' требуется параметр 'decoratorsBeforeExport', значение которого должно быть логическим.

Я получаю следующую ошибку: если вы переходите с Babylon / Babel 6 или хотите использовать старые предложения декораторов, вам следует использовать плагин decorators-legacy вместо декораторов.

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
    }
}

reactjs decorator mobx-react
person KNIGHT MAHAJAN    schedule 09.11.2018    source источник
comment
Сообщение об ошибке ясно говорит, что не так. Непонятно, при чем здесь tsconfig.json. У вас не было бы этой проблемы, если бы для транспиляции декораторов использовался Typescript.   -  person Estus Flask    schedule 09.11.2018
comment
@estus Я использую babel в качестве транспилятора, а не Typescript. Не могли бы вы предоставить решение в соответствии с Babel? Спасибо!   -  person KNIGHT MAHAJAN    schedule 09.11.2018
comment
Решение - использовать устаревшие декораторы. См. github.com/loganfsmyth/.   -  person Estus Flask    schedule 09.11.2018

Ответы (4)


arrow_upward
33
arrow_downward

Сообщение об ошибке немного сбивает с толку, однако, немного углубившись в поиск, вы можете решить его, используя следующий подход.

Я не делаю никаких предположений, за исключением того, что в этом руководстве вы используете веб-пакет.

Вам нужно добавить декораторы предложений babel в зависимости от разработчиков (они нужны вам только во время разработки) (которые вы уже добавили).

при использовании пряжи

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

otheriwse для npm

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

затем в файле package.json найдите раздел конфигурации babel или добавьте его, если его нет. Имя конфигурации строго "babel".

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

При вводе текста от руки обратите особое внимание на отступ. обратите внимание, что объект "@babel/plugin-proposal-decorators" глубоко вложен в два массива, поэтому для работы он должен быть как таковой.

и просто для проверки работоспособности ваши devDependencies как минимум будут такими

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

Теперь вы можете создать свое приложение с помощью yarn или npm и жить долго и счастливо.

person Mpho Majenge    schedule 10.11.2018
comment
@rlandster спасибо за решение. Теперь это работает как шарм! - person KNIGHT MAHAJAN; 10.11.2018
comment
Опечатка в командах yarn и npm install: bable, должно быть babel. - person Dashu; 10.11.2018
comment
это сработало отлично, но учтите, что вы хотите редактировать package.json, а не package.js :) - person Casey L; 02.02.2019
comment
@SlugFrisco, спасибо, что подняли это, я обновил ответ, чтобы отразить правильное имя файла. - person Mpho Majenge; 06.02.2019

arrow_upward
4
arrow_downward

Реагировать на родной 0.59

babel.config.js:

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

npm install @babel/plugin-transform-flow-strip-types @babel/plugin-proposal-decorators @babel/plugin-proposal-class-properties --save

Источник: https://github.com/facebook/react-native/issues/20588#issuecomment-448218111

person Ives.me    schedule 17.06.2019

arrow_upward
0
arrow_downward

Ответ находятся в официальном документе: https://mobx.js.org/best/decorators.html

вы можете найти множество способов включить его в разделе «Включение синтаксиса декоратора»

возьмем, к примеру, Babel 7, создадим проект с помощью mobx + create-react-app с нуля:

npx create-react-app hello-mobx

//This moves files around and makes your app’s configuration accessible.
npm run eject

npm install --save-dev babel-plugin-transform-decorators-legacy
npm install --save-dev @babel/plugin-proposal-decorators
npm install --save-dev @babel/plugin-proposal-class-properties

отредактируйте package.json: package.json:

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

установить mobx:

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

Наслаждайтесь!

person LIU YUE    schedule 05.05.2020

arrow_upward

arrow_downward

person    schedule
comment
эта конфигурация в .babelrc успешно решила мою проблему - person 李海双; 02.12.2018