I try to make my first steps using React Native. Development for Android (on Windows host) works. Now I wanted to test iOS, and tried to set up a development environment on a MacBook Pro.
Problem: React Native starts the iOS simulator, and then nothing happens any more. The simulator runs OK, but my React native app won't start.
What do I need to do to get my React Native installation going?
More Info:
I set up XCode and React Native according to the docs on the MacBook Pro running OSx 10.13.2 (High Sierra). XCode was installed and tested successfully, including the simulator.
When I installed Node.js I deliberately picked an older version (containing npm 4.2.0), since forums say that React Native does still have problems with npm 5. I also installed Homebrew and Watchman, like stated in the docs.
To initialize an empty project, I used
create-react-native-app HelloWorldProject
and a projet structure got created in my Documents folder.
If I finally fire up my "Hello World" test app using
cd HelloWorldProject
sudo react-native run-ios
the system responds:
Starting packager ...
Starting simulator ...
and then nothing happens. The simulator does indeed start (boot --> apple logo --> progress bar --> IOs start screen), but nothing happens afterwards.
Edit
I have given up on React Native for several reasons, I leave this question here for documentary purposes, but I cannot verify or accept any answer, I don't have a React Native development environment any more.
It's probably because you used sudo. /.expo/ is owned by root. Try to change the ownership with
sudo chown -R `whoami` ~/.expo
Refer https://github.com/react-community/create-react-native-app/issues/422
Even everything in your app seems fine, sometime you face the issue that the app is taking too much time to load either through terminal or Xcode. If there is no any other specific issue with your project, the following solution works most of the time:
Go to your app folder and then go to 'iOS' folder.
Delete 'Podfile.lock' and 'Pods' folder.
Execute the following command in Terminal from your 'ios' folder, that will bring back the 'Podfile.lock' and required Pods will be installed to 'Pods' folder:
pod install
Delete the 'build' folder in your 'iOS' folder.
Run the following command in terminal:
react-native run-ios
While the terminal is running, open '.xcworkspace' in your 'ios' folder in Xcode.
The above steps will make sure it will be build your react native project newly and will run on the simulator.
Thanks
Wasantha Wijayaratna
Related
Trying to build a React Native iOS app, and while I got it running fine using Android, trying to get it running on iOS has been a bit of a nightmare.
I created this base react native app, back in Sept 2022, doing the typical npx react-native init <projectname> and was working on android mostly (I use a linux box, and I have to use Teamviewer to connect to a mac to build the iOS apps).
I had my app working fine in android and iOS, and then added the Zoom Video SDK and everything went to hell. Got it working fine in Android, and tried to take my changes and build them in iOS but I couldn't get it to work, and seemingly got my iOS project corrupted, so I tried to create a fresh iOS project, by basically created a same-named project in a different directory, and replacing the <projectname>/ios with the new base ios project.
Of course, I did this Jan 2023, so it's the new architecture, and the AppDelegate.h tries to import the RCTAppDelegate.h file instead of React/RCTBridgeDelegate.h
I do my usual yarn install go into the ios directory and pod install and then try to do a yarn run ios and it tells me it can't find RCTAppDelegate.h
Anyone solve this yet? The React-Native docs aren't up to date with their github repo
I got the same error, i solved it by opening the .xcworkspace instead of opening .xcodeproj
I also cleaned the build folder by
Product --> Clean Build folder
and then it successfully built the app.
I'm on an M1 Mac Mini, Monterey 12.0.1, with XCode 13.1 & it's command-line tools and freshly-installed Flutter MacOS 2.8.0. I create a base Flutter project with
flutter create appname
When I do "flutter run" in the ios folder (in the parent folder it launches ok in Chrome), I get the message:
Could not build the application for the simulator.
Error launching application on iPhone 13.
I tried it with the simulator running, and not. It looks like the Runner XCode project build stages runs a script, xcode_backend.sh. I also tried loading the project in the XCode UI to build and get 'Command PhaseScriptExecution failed with a nonzero exit code' on that script.
If I go and run this script directly, from the project folder of the ios folder:
guy#Guys-Mac-mini ios % /bin/sh "$FLUTTER_ROOT/packages/flutter_tools/bin/xcode_backend.sh"
I get the message:
error: Your Xcode project is incompatible with this version of Flutter. Run "rm -rf ios/Runner.xcodeproj" and "flutter create ." to regenerate.
I tried the steps indicated, which I also found on Google, and removed the folder and regenerated the project, but the same message is appearing. (I did export the FLUTTER_ROOT environment variable, both in the shell and it's also defined in the XCode project settings.
I can build and run the flutter apps to Chrome, but not for the iOS simulator. I also have no problem building and running Swift apps I've coded on the simulator.
I got my Windows and Android setup running in minutes, but on the M1 Mac it's been hours without success. Any ideas?
I'm a developer with decent of experience, but this is my first stab at Flutter and cross-platform (other than Xamarin). Any help is appreciated.
I can't fully explain it, but the problem I was having was related to my having the project files on an SMB share I was accessing from the Mac.
I setup the project on an SMB share so I could access it from my Windows and Mac workstations. I found that any flutter project on that share would fail compilation.
To test this, I created a new flutter app on my Mac Documents folder, comiled and ran it succesfully in the iOS simulator using 'flutter run'. When I moved that project to the SMB share and tried to run it, I got the compilation error again, and it wouldn't run (I also tried clean and run). I moved the project back to the local drive Documents folder, and was able to run it again.
I also noticed that the Mac access to the SMB share is painfully slow, though I tried a required_signon fixes from
https://kb.synology.com/en-us/DSM/tutorial/What_can_I_do_to_fix_slow_SMB_file_transfers_on_OS_X_10_11_5 but it didn't help.
I had even tried to factory reset my Mac, and I thought that fixed it, but it was only because I hadn't connected to the share yet, and made a test project on the local drive.
PS: I don't expect to use the exact same Flutter project between the Mac and Windows workstations because of paths and SDK locations, but I am using it as a convenient place for transfering the source files.
My team was able to solve this by supplying an absolute path to the xcode_backend script in a run phase and running it. Running it once seemed to be enough and we could remove it thereafter:
/bin/sh "/absolute-path-to-flutter/packages/flutter_tools/bin/xcode_backend.sh" thin
/bin/sh "/absolute-path-to-flutter/packages/flutter_tools/bin/xcode_backend.sh" embed
I am working on a react-native app using expo. The app was working just fine. I could do npm start to run the metro builder and then run my app on simulator as well as iOS devices directly.
I did 2 things.
I upgraded the expo version to latest - 3.17.15
I rebooted my laptop.
After these 2 changes, I could still do npm start without any issues. But, when I tried to open/ run the app in iOS simulator it got stuck at the bundle loading. In fact it could not get the bundle file only.
I thought this was a network problem where the simulator/ device was not able to reach http://127.0.0.1:19000 However, when I visited the url in the browser that was working.
The bunlde url that I saw in the error:
Now, when I try to visit that bundle url through the simulator:
http://127.0.0.1/node_modules/expo/AppEntry.bundle
The browser never loads the thing and times out.
I have already tried:
Cleaning the cache - npm start --reset-cache
Deleting the .expo folders in ~/.expo as well as ~/project/.expo
Changing the mode from Lan -> Tunnel.
Upgrading the global expo-cli to latest version.
removing the node_modules directory in the project ~/project/node_modules
re installing the node_modules by doing - npm install.
IMPORTANT - After having this issue with my current app, I decided to spawn a new blank expo app and run the same. Same result. The bundle was not loaded. I also remember something like this happening to me in the past but don't remember how I fixed it.
My Network is a hotspot through my phone. The same network used to work until yesterday without any issues. So not sure if reboot has caused some setting to revert.
Any help troubleshooting this problem would be very helpful here.
Finally after spending 2 days and working on 2 different laptops I could get to the root of this problem.
Firstly, I thought this was an OS upgrade issue (I upgraded my OS to Mac OS Catalina). So, I cloned my repo on another laptop, a fresh one where these was no node expo or react native. I initialized a new expo typescript react native project. Tried to run it - Worked like a charm. Simulator was not installed but worked on my device without any issues. The metro bundle log was generated.
This was leading me even closer to my assumption. So I tried to revert all the changes I had in my repo and tried building the app with npm start which eventually runs expo start. Did not work.
Finally - I created a fresher user on my laptop. The upgraded one. Cloned the repo - and tried to build the project. This time! Again it failed, however there was one change - in the metro builder log I got a this error:
2020-04-06T21:29:57,075: [0x110e7fdc0] while computing sockname: failed to create /usr/local/var/run/watchman/shrikant-state: Permission denied
Watchman: watchman --no-pretty get-sockname returned with exit code=1, signal=null, stderr= 2020-04-06T21:29:57,075: [0x110e7fdc0] while computing sockname: failed to create /usr/local/var/run/watchman/shrikant-state: Permission denied
To solve that I just changed the permission to the watchman directory:
sudo chmod 042777 /usr/local/var/run/watchman/
The app was finally built and running successfully on both the simulator and the device!
If anyone else runs into something similar, I was stuck on this and it turned out expo didn't like me using a logical OR assignment ( ||= ) even though typescript and my linters were fine with it. I replaced my ||= with a ternary and worked fine.
I am trying to set up a react-native development environment. I would like to set up an iOS emulator (preferably an iPhone 10) to run my app on. I am using a Macbook Pro 2016 running on MacOS 10.14.3. I have installed my react-native app through the command create-react-native-app (running version 2.0.2). I also have installed XCode running version 10.2(10E125). When I scan the QR code that Expo generates and run it on my iPad or my Android device it works just fine, but when I try to load the iOS emulator by pressing i after expo start it returns the error
Trying to open the project in iOS simulator...
Simulator is installed but is identified as 'com.apple.CoreSimulator.SimulatorTrampoline'; don't know what that is.
Simulator not installed. Please visit https://developer.apple.com/xcode/download/ to download Xcode and the iOS simulator. If you already have the latest version of Xcode installed, you may have to run the command `sudo xcode-select -s /Applications/Xcode.app`
I have already tried running the command sudo xcode-select -s /Applications/Xcode.app
I have also tried running the command xcode-select -r
I have also confirmed that in my XCode->Preferences->Locations Command Line Tools is selected as "Xcode 10.2(10E125)"
None of these have worked.
I am expecting that after pressing i after expo start an iOS emulator loads up. Thank you.
-----EDIT-------
After some more research, I found out that running open -a Simulator and then running expo start loads the app on an emulator and works for my purposes. But still if I just run expo start without running open -a Simulator it still gives the same error. I want to ask if this is the best I am going to get?
You might be running an outdated version of Expo. I had this problem when I was download someone's old repo using Expo 27 when Expo 36 came out. After updating to the latest version, it works.
To update packages in your project, npm-check-updates comes in handy.
npm i -g npm-check-updates # installs ncu globally
ncu -u # updates all dependency versions in your local package.json
npm install # updates the packages in node_modules to match
Note: This will update all your dependencies to the latest version. If you don't want to do this, you can find the latest version of expo and change the version in package.json manually.
I ran into the exact same problem all of a sudden. Clicking "Run on iOS Simulator" within the Expo Developer Browser worked 2 days ago but did not work today. Your clue of using open -a Simulator helped me though. I went into Xcode and clicked the Xcode menu > Open Developer Tool > Simulator. This started the Simulator and then I was able to click "Run on iOS Simulator" within the Expo Developer Browser and it worked as expected. If you haven't had the fortune of "Run on iOS Simulator" working, I'm guessing you could just start a simulator, download Expo from the App Store and just use it from there. None of this answers the question as to why the error happens but at least gives a few workarounds for anyone else that might need. All that matters is you get the app running on the Simulator in the end!
My iOS emulator is no longer opening when I run "phonegap run ios" in the terminal on Mac OS X. I receive no error messages and:
[phonegap] Platform "ios" deployed to emulator.
[phonegap] successfully installed onto emulator
While this is currently a known bug, you can run the emulate command more directly (note you need to build separately):
phonegap local build ios
/platforms/ios/cordova/emulate
You can also run the application using the same technique:
phonegap local build ios
/platforms/ios/cordova/run
NOTE: When using this method to run the app on your phone, the task might get stuck on the splash screen. To fix this, launch the Activity Monitor on your Mac and quit any processes with the name "ios-deploy". From there you can launch the application on your phone by clicking the application icon.
Or, you can even look inside the generated /platforms/ios folder and launch XCode project directly to test in an emulator or on your device. Open project and click the RUN button.
IMPORTANT: with all of the above methods, you MUST run the build command before running:
phonegap local build ios
Not really an answer, but I can say this is a known bug. Here is the bug so you can track it:
https://issues.apache.org/jira/browse/CB-5103
I only had this problem after upgrading to 3.1. I downgraded to 3.0 and it works more reliably:
npm uninstall -g phonegap
npm install -g phonegap#3.0
Also had to delete the platform/ios dir and plugins/ios.json and then run 'phonegap build ios' and 'phonegap run ios'