React-Native 0.57: 'Can't find variable: require' with metro-react-native-babel-preset

半城伤御伤魂 提交于 2019-12-06 04:36:13

Got the solution, my .babelrc was okay, but the packager cached the very first wrong one so I had to start the packager as: react-native start --reset-cache

After looking at below github issue it looks like the issue is caused by corejs option @babel/plugin-transform-runtime, So replace it by @babel/polyfil

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

.babelrc config for ref

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

Install Babel polyfill 7 "@babel/polyfill": "^7.0.0"

And import that in App component

  import '@babel/polyfill'
najeal

It seems that react-native start --reset-cache works.

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!