Install and debug react-Native (Mac version)

The preparatory work

Install the necessary software, here is not detailed, specific can refer to the official documentation

  • Install the react-native Cli NPM install -g create-react-native app

  • Xcode installs and upgrades to 8+

  • Initializing an RN project with react-native init rnHelloWord may be slow, so be patient

Start the project

  • Enter the project and start

    cd rnHelloWord
    npm start
    Copy the code

    Can also use the Xcode to start the project, click on the ios/AwesomeProject xcodeproj, click the upper right corner of the Run, Run.

debugging

Simulator debugging

After the project is started, click simulator Command + D – select Enable Live Reload to monitor changes in RN code (hot replacement) and directly modify the code to view the latest modifications.

Real machine commissioning

Settings on the PC

  • The phone connects to the computer via USB and selects the phone as the target device in Xcode.

  • Fill in the picture and select:

  • Also select the developer account to use in the Tests target.

Now that the basic work is done, you can hit Run to start

Settings on your phone

  • At this time, there is an rnHelloWord app installed on the phone, click on the start may play a ‘untrusted’ prompt, how to do?

  • Don’t worry, we can set – General – Device Management – Add trust on the phone

  • Then you can start normally

  • Once the app is launched, you just need to shake the phone to bring up the debug menu, which has the same functions as the emulator, but I won’t explain them here.

Then you can develop.


conclusion

The React-Native runtime environment can be difficult to install, and you’re close to success. It has a syntax similar to React. Roll up your sleeves and write code.

For more articles, see: My blog