Babel плагин-предложение-декораторы не работает, как ожидалось - PullRequest
0 голосов
/ 21 ноября 2018

Я добавил эти две devDependencies в мой package.json:

"@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 или нет.

1 Ответ

0 голосов
/ 08 декабря 2018

Во-первых, убедитесь, что вы используете последнюю версию metro-react-native-babel-preset, они выпустили новую минорную 0.50.0 только 9 дней назад.

Если это не помогло, скорее всего, проблема возниклаиз того факта, что metro-react-native-babel-preset уже включает плагин свойства класса, и, как вы знаете, порядок плагинов значения , , вам нужно запустить декоратор до того, какплагин свойства класса .

Было много дискуссий по этому вопросу упорядочивания в babel, и хотя плагины должны запускаться до предустановок, все равно будет проблемой ,К сожалению, PR # 5735 для добавления возможностей упорядочивания плагинов все еще находится в стадии разработки.

В то же время вы можете сделать что-то одно: либо раскручивать свой собственный metro-react-native-babel-preset и добавить плагин декоратора.перед плагином свойства класса в месте, которое я указал.Вы также можете попытаться создать собственную предустановку babel, включающую два плагина в правильном порядке, и добавить ее после метрополитена, так как предустановки загружаются в обратном порядке, с последней по первую, как показано здесь .

Также стоит попробовать запустить упаковщик, используя yarn start --reset-cache, который может решить проблемы, вызванные плохим / устаревшим кэшем.

...