React-Native 0.57: «Не удается найти переменную: требуется» с помощью Metro-React-native-Babel-Preset

Я начал мультиплатформенный проект с совместным использованием кода между react-native и react-js. Итак, у меня есть настройка веб-пакета для браузера/Электрона и настройка 0.57 с реакцией для Android/iOS. У меня сейчас проблема следующая: Не удается найти переменную: требуется

Это может быть очень наглый вопрос, но нужно ли мне что-то еще? Я читал, что React-native должен поддерживать требование сам по себе, но пока не нашел ничего, связанного с этой настройкой.

.babelrc {"presets": ["module:metro-react-native-babel-preset"]}

Я также использую @babel/polyfill и @babel/runtime на стороне браузера, но мне интересно, будут ли они мешать.


react-native reactjs babeljs babel-polyfill
person Phyrian Ahram    schedule 29.09.2018    source источник
comment
Проверьте эту ветку, у них есть решение github.com/facebook/react-native/issues/21048 . Проверьте конфигурацию m-vbd babel и решение takion, их комментарии должны помочь решить проблему.   -  person Hemadri Dasari    schedule 29.09.2018

Ответы (3)


arrow_upward
5
arrow_downward

Получил решение, мой .babelrc был в порядке, но упаковщик кэшировал самый первый неправильный, поэтому мне пришлось запустить упаковщик как: react-native start --reset-cache

person Phyrian Ahram    schedule 29.09.2018

arrow_upward
2
arrow_downward

Посмотрев на проблему github ниже, похоже, что проблема вызвана параметром corejs @babel/plugin-transform-runtime, поэтому замените его на @babel/polyfil

https://github.com/facebook/react-native/issues/21048

.babelrc конфиг для ссылки

  {
  "presets": [
      "module:metro-react-native-babel-preset",
  ],
  "plugins": [
      "react-require",
   [
        "module-resolver",
     {
        "root": [
          "./src",
          "./assets"
        ],
        "alias": {
           "app": "./src",
          "assets": "./assets"
         }
      }
    ],
    [
        "babel-plugin-require-context-polyfill",
   {
    "alias": {
      "app": "./src"
    }
  }
   ],

     "@babel/plugin-proposal-export-default-from",
     "@babel/plugin-proposal-export-namespace-from",

    "@babel/plugin-transform-flow-strip-types",
   [
     "@babel/plugin-proposal-decorators",
  {
    "legacy": true
  }
    ],
     [
      "@babel/plugin-proposal-class-properties",
      {
    "loose": false
      }
     ],

      [
       "@babel/plugin-transform-runtime",
       {

       }
     ],

   ],
     "sourceMaps": true
 }

Установите Babel polyfill 7 "@babel/polyfill": "^7.0.0"

И импортируйте это в компонент приложения

  import '@babel/polyfill'
person Hemadri Dasari    schedule 29.09.2018
comment
@babel/polyfill уже установлен и импортирован, уже перепробовал кучу плагинов, но ни один не помог. В этом решении есть много плагинов, которые, я не уверен, мне понадобятся. Какой из них является ключом или как они объединяются, чтобы раскрыть дело? - person Phyrian Ahram; 29.09.2018
comment
Я столкнулся с похожими проблемами, добавив @babel/preset-env, @babel/preset-react и @babel/plugin-proposal-class-properties. - person Fabrizio Bertoglio; 17.03.2019

arrow_upward
1
arrow_downward

Кажется, что react-native start --reset-cache работает.

person najeal    schedule 08.11.2018