Save money: Failure! ! ! Build projects using a simple sandbox environment! ! !
Thousands of horses galloping! ! !
Mac version
Follow the steps on the official website, V 0.72
Note: Before starting, I deleted the existing Homebrew on my computer and reinstalled the latest version of Homebrew. Scientific Internet tools are used in the process.
For Homebrew installation issues, you can refer to this blog.
1. Install node
brew install node@16
When the download reaches a certain stage, it cannot continue. After stopping, be patient and continue to execute the above instructions. After the execution failed N times, directly download the pkg from the Nodejs official website for installation.
2. Install watchman
brew install watchman
Just like the command in 1, the installation will be interrupted (failed) when installing a certain framework that takes a long time. Then execute this command repeatedly until the download is successful.
I executed this command about 4 times.
Taobao source is not switched.
3. Configure yarn
npm install -g yarn
Administrator rights are required to execute
sudo npm install -g yarn
4. Xcode installation
After the installation is complete, configure the emulator.
I won’t go into details about the installation of Xcode here. If you don’t understand, you can search for the installation configuration by yourself.
5. CocoaPods installation
CocoaPods is known as npm for iOS.
Installation instructions, choose one of the following:
sudo gem install cocoapods brew install cocoapods
I initially used brew to install it. After all, I just installed brew and wanted to continue using it.
During the process, I still encountered the problem of slow installation and interruption of a certain library. I executed the brew installation cocoapods command three or four times before the installation was OK.
6. I have installed react-native-cli before, so I need to execute the uninstall command first.
npm uninstall -g react-native-cli @react-native-community/cli
7. In the folder where you want to create the ReactNative project, execute the following instructions to create the project
npx react-native@latest init AwesomeProject
However, it still failed! Project creation failed!
The result is as shown above!
? Installing Ruby Gems
error Ignoring ffi-1.15.1 because its extensions are not built. Try: gem pristine ffi –version 1.15.1
? Installing Ruby Gems
error Looks like your iOS environment is not properly set. Please go to https://reactnative.dev/docs/environment-setup?os=macos & amp;platform=android and follow the React Native CLI QuickStart guide for macOS and iOS.
Cause Analysis:
1. Cocoapods problem?
Just a wild guess, but during the investigation, I made a major discovery! ! !
Mac comes with its own ruby environment, and Cocoapods and Homebrew both update and use the ruby environment during installation and configuration. Moreover, due to the path problem, we have always used the ruby that comes with Mac, so at this address, we found a method to modify the ruby environment address.
I will also record a copy here. The specific modification steps for modifying the ruby environment path are as follows:
step one:
Enter the following terminal commands in sequence
which ruby ruby -v
The following results are obtained, indicating that your computer’s ruby environment is Mac’s default ruby environment.
Step 2:
Execute the following commands in the terminal, or find the file directly to edit it
open -e ~/.zshrc
If you are told that the .zshrc file is not found, please go here to create and use the .zshrc file.
Step three:
Enter the following in the .zshrc file
Inter chip:
if [ -d "/usr/local/opt/ruby/bin" ]; then export PATH=/usr/local/opt/ruby/bin:$PATH export PATH=`gem environment gemdir`/bin:$PATH fi
M series chips:
if [ -d "/opt/homebrew/opt/ruby/bin" ]; then export PATH=/opt/homebrew/opt/ruby/bin:$PATH export PATH=`gem environment gemdir`/bin:$PATH fi
Step four:
Save and close the .zshrc file.
Close the terminal window to confirm the changes.
Step five:
Enter the ruby -v command again to obtain the latest ruby version (if it is not the version in step 1, it means that the path has been modified, and there is no need to execute the which ruby command again).
After performing the above steps, execute the npx react-native@latest init AwesomeProject command in the target folder again to try to create a React Native project.
Another error message
? Processing template
? Installing Ruby Gems
error /Library/Ruby/Site/2.6.0/rubygems.rb:264:in `find_spec_for_exe’: can’t find gem bundler (>= 0.a) with executable bundle (Gem ::GemNotFoundException)
from /Library/Ruby/Site/2.6.0/rubygems.rb:283:in `activate_bin_path’
from /usr/bin/bundle:23:in `
? Installing Ruby Gems
error Looks like your iOS environment is not properly set. Please go to https://reactnative.dev/docs/environment-setup?os=macos & amp;platform=android and follow the React Native CLI QuickStart guide for macOS and iOS.
Isn’t this still a Ruby problem? Wasn’t the modification successful?
ruby -v found that there is indeed a problem with the ruby path.
Follow the above blog again to modify the ruby default path.
Then execute the npx react-native@latest init AwesomeProject command again to create the project.
Failed again. The error is reported as follows:
? Installing Ruby Gems
? Updating CocoaPods repositories (this may take a few minutes) fatal: unable to access ‘https://github.com/CocoaPods/Specs.git/’: Recv failure: Operation timed out
?Updating CocoaPods repositories (this may take a few minutes)
?Updating CocoaPods repositories (this may take a few minutes)
error Failed to update CocoaPods repositories for iOS project.
Please try again manually: “pod repo update”.
CocoaPods documentation: https://cocoapods.org/.
info Run CLI with –verbose flag for more details.
Subsequently, executing pod repo update fails.
Then execute: sudo pod repo update –verbose
Something went wrong. I added sudo as a matter of course. After execution, an error was reported and sudo could not be used, but I didn’t pay attention.
Then start searching: [!] CocoaPods was not able to update the `cocoapods` repo. If this is an unexpected issue and persists you can inspect it running `pod repo update –verbose`
I found a blog that said to execute pod repo list and found that there are three repo sources, and then executed
pod repo remove XXX to uninstall the sources that feel wrong one by one. During the process, the wrong source may be uninstalled, causing cocoapods to be uninstalled and reinstalled later.
Then execute the pod repo update command. Error reported:
[!] CocoaPods was not able to update the `cocoapods` repo. If this is an unexpected issue and persists you can inspect it running `pod repo update –verbose`
Execute pod update to try to update again. Error reported:
[!] No `Podfile’ found in the project directory.
Forget it, uninstall it! This is what you get for messing around. Stop messing around, uninstall cocoapods, and start over.
brew uninstall cocoapods
Then: sudo gem install cocoapods, another way to install cocoapods. Successful installation.
Seeing the terminal tells me:
A new release of RubyGems is available: 3.4.10 → 3.4.21!
Run `gem update –system 3.4.21` to update your installation.
Then execute the command: gem update –system 3.4.21
Subsequently: ruby -v
Got the result: ruby 3.2.2 (2023-03-30 revision e51014f9c0) [x86_64-darwin21]
(It seems to be the same as the previous ruby version, so don’t worry. In fact, the update failed, but I feel that this 3.2.2 is also OK)
It took a long time.
Execute: pod setup command and get the result: Setup completed.
In the React Native environment configuration, after installing cocoapods, there is no requirement to execute the pod setup instruction. I found this instruction when searching for uninstalling and installing cocoapods. I seem to recall that cocoapods requires setup. Just execute it.
Then enter pod –version to get the current version number 1.14.2. Previously it was 1.13.0 . This can be regarded as the end of this period of tossing.
There is only one repo source output by pod repo list.
Execute: pod repo update command. Think about executing this command before creating a React Native project, so as not to report repo problems later when creating the project.
Still reporting an error:
Updating spec repo `cocoapods`
$ /usr/bin/git -C /Users/xuedongli/.cocoapods/repos/cocoapods fetch origin –progress
fatal: unable to access ‘https://github.com/CocoaPods/Specs.git/’: Failure when receiving data from the peer
[!] CocoaPods was not able to update the `cocoapods` repo. If this is an unexpected issue and persists you can inspect it running `pod repo update –verbose`
Then execute: pod repo update –verbose. …
The update was successful! . . . . . .
I have been struggling for a long time. Is it because I added sudo for granted? . . . . . Why!
Continue to execute: npx react-native@latest init AwesomeProject command to create the project!
This ends the exploration of the native installation method of React Native!
Next, we will use the Simple Sandbox environment to create the project!
This chapter is over!