I have a question about speeding up the dev process from react native. If I run react-native run-ios in the project root via terminal. A new terminal-window pops out and the packager is running on port 8081. As well as the packager starts also the simulator.
After a few seconds the package says
React packager ready.
[5:15:59 PM] <START> request:/index.ios.bundle?platform=ios&dev=true&minify=false
[5:15:59 PM] <START> find dependencies
After that it takes about 6-10 minutes that the simulator connects to the packager (during this time the simulator throws a few times erros that he can't connect cause he got a timeout). But after the packager is initialized everything works fine. The app has been started and it's connected to the packager.
Everytime when I install new modules (via npm for example) or remove some files I have to delete the app form the simulator and have to run the react-native run-ios again. Also sometimes when I changed only code. On the other hand sometimes I can change code and can reload via CMD + R in the simulator and everything works as expected.
Can I speedup the packager or is there something which i missed about reloading? I don't have that many modules installed and the project is at the very beginning (very small)
Related
I'm building an app with Ionic 6 + capacitor. It works fine when testing on the browser and the Android build. However, when I try to build it using XCode it just doesn't work: it only shows a blank page.
If I run the command ionic capacitor run ios -l --external from Webstorm, the iphone emulator starts and everything works fine. If I open the project with XCode and click the play button, it shows the emulator with a blank page.
My capacitor.config file is:
{
"appId": "com.ionic.app",
"appName": "ionic-app",
"webDir": "www",
"bundledWebRuntime": false,
}
The console of XCode when starting the app is:
2021-12-30 17:09:09.817042+0100 App[22182:360758] KeyboardPlugin: resize mode - native
⚡️ Loading app at capacitor://localhost...
⚡️ [log] - Angular is running in development mode. Call enableProdMode() to enable production mode.
⚡️ WebView loaded
⚡️ To Native -> App addListener 101717497
Notice that localhost doesn't show the usual 8100 port.
The problem is that when I run the app via XCode, the angular server is not starting, hence the app is only a blank page. If I start the server via ng run app:serve --host=0.0.0.0 --port=8100 and I add the following config to capacitor.config in XCode:
"server": {
"url": "http://localhost:8100"
}
Then everything works fine again.
Is there any command or any capacitor config I would need to include to start the angular server when the app starts? Or I don't need to start it and the problem may be somewhere else?
Thanks in advance
UPDATE:
The problems seems to be in the auth guard. I still have to find out what exactly causing the problem, but without the guard the app works fine.
You can run 2 ways your project:
Live Reload
Built app
Live Reload is a good way for debugging the Mobile App, because you will see the changes in 1 sec.
For Built app, you need to do a lot of process:
Run ng build and check where it's build (usually dist/nameoftheproject)
Go to capacitor config.ts and change "webDir": "www" to webDir: "dist/nameoftheproject"
Remove the server property in capacitor.config.ts (It's only for Live Reload)
Run npx cap sync
Then npx cap open ios for opening Xcode
Now, that's why people prefer using "Live Reload" for debugging because using the "Built app way" it's too long to see every change.
Edit: In fact, when you finish your app, you need to build it again if you plan to publish it on the App Store.
So that's how you will see your app in Xcode. Good luck! <:)
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 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
When I run cordova run ios --emulator the script exits successfully and tells me, that there's a file (console.log) inside platforms/ios/cordova but there's no such file although I used console.log several times in my code.
Also, Safari does not show my device in the developer menu when it's connected via USB and running the app. I used cordova run ios --device to run the app.
Am I looking in the wrong place? Does the script lie? :D
react native can't run iOS,I have to configure the environment in accordance with the official website of the method, but has been unable to run
first
Run time results
Try this:
Shut the Terminal spawned by React Native.
Shut down XCode completely
Re-open everything and re-run.
Try:
Close the terminal packer
Stop Xcode from debugging
Close the Google Chrome tab that has been spawned for debugging purposes
Restart Xcode debugging using the Play button
OR
By navigating to your React Native project folder, run:
npm start