Recently, I used React Native technology to develop App applications, and encountered a lot of problems when building projects. It takes time and energy to find solutions online. I hope to summarize some problems and help readers.

My personal blog

This time, we encountered an exception thrown by Babel when compiling ES6 source code, which caused the project to fail to start. The react-native run-ios was executed, and the emulator was started.

While Error bundling Cannot find module @babel/core is not available at all, the react Native App is not available at all. Babel-react-native, this is a bug in its latest version and can be rolled back to 2.1.0 and deleted first (either using YARN or NPM for setup pack management) :

yarn remove babel-preset-react-native
or
npm unstall babel-preset-react-native
Copy the code

Then install the specified version:

Yarn add --dev [email protected] or NPM install --save-dev [email protected]Copy the code

Finally, start the application again:

react-native run-ios
or 
react-native run-android
Copy the code

The application is running properly.

React Native version problem

Of course, you may also encounter an exception:

The latest React Native version requires Xcode greater than 9 and Mac OS greater than 11, so you can change React Native to 0.53.3:

React-native Init myApp --version 0.53.3Copy the code

Babel Preset is an issue

If you are using the new ES6 syntax Generator, you should note that the following export syntax will generate an error:

export default function * root () {
  yield. }Copy the code

You need to change the export mode to the following, assign the value first and then export:

const root = function * root () {
  yield. }export default root;
Copy the code

Of course, if you don’t want to change the code, you need to lower babel-react-native to 2.0.0:

Rm -rf. /node_modules yarn cache clean or NPM cache clean yarn add --dev [email protected] yarn install Watchman watch-del-all // If watchman is usedCopy the code

Then kill the process started last time, restart the application, then compile normally, run:

react-native run-ios
Copy the code

For details, see How to Clear the React Native Packager.