I have an interesting scenario. It was an expo project that I converted to react-native. I don't have a react-native command (but can run npx react-native, but my understanding is to build the test APK I run yarn android which actually runs expo run:android.
However, my dev server is remote, so I'm looking to generate an APK and then use the developer menu to set the IP address of the dev server on the device, then connect to the react native server (i.e. not using Expo anymore)
How do I go about building this APK? When I use yarn android it says there are no devices connected and won't build.
Thanks!
npx react-native run-android builds an APK in ./android/app/build/outputs/apk but then fails. Just install this APK, then run it, shake the device to get the menu to pop up (or Cntrl-M for the menu on an emulator), settings, and dev server info is there (port 8081 default).
Related
I'm trying to implement RevenueCat In-App Subscriptions into my Expo managed app, and to test the implementation I need to do it on a real device.
So far, I ran:
expo install expo-dev-client
expo install react-native-purchases
eas build --profile development --platform android
I downloaded the development build and installed it on the device, then I ran:
expo start --dev-client
After starting the dev server, it isn't visible on the development build I installed on the real device - I also tried manually adding the local address to the server, however I get the same error:
There was a problem loading the project. This development build encountered the following error.
failed to connect to /192.168.1.187 (port 8081) from /192.168.1.133 (port 52184) after 10000ms
I need to mention that I've successfully installed the development build inside the Android emulator and I was able to connect to the dev client on it (I cannot test RevenueCat implementation here).
I found out the solution to the mentioned problem, so if you're unable to connect to expo dev client using your Android device, make sure to disable your Windows Firewall, that fixed the issue!
I am working on a react-native application, when I run my debug build I am able to debug using the metro tool using the following commands.
npx react-native start
npx react-native run-android
Magically my emulator pops up and if I click "d" in the metro terminal it activated my debugging tools.
When I run
npx react-native run-android --variant=release
When I click "d" in the metro terminal it says
warn No apps connected. Sending "devMenu" to all React Native apps failed. Make sure your app is running in the simulator or on a phone connected via USB.
info Opening developer menu...
Is there something about the release build that does not allow for the use of these debugging tools or is there something I need to do within build.gradle or some other configuation file to enable using the metro debugger.
I am new to react-native development so my apologies if my terminology is off.
Appreciate you help!
After receiving feedback from various people on and off of SO it seems that the debugger is not meant to be used in the release build.
In my circumstance there was an issue with gradle configuration involving react-native-config which was a known issue related to Progaurd which would only impact release builds.
As recommended in this post I used the javascript alert() method to debug the issue.
ionic run android -l --external with this I got to test the app on phone with hot reloading, but when I try to build it on studio it just shows a blank white screen after the capacitor logo.
I am just testing out ionic, just got the tabs template going on to test it out.
here's how I build the apk.
ionic run android -> then on android studio -> build apk
I'm getting a similar problem, using WSL and the Windows Android Studio:
On WSL:
ionic start photo-gallery tabs --type=react --capacitor
cd photo-gallery/
ionic integrations enable capacitor
npx cap init photo-app com.mike.atkinson
mkdir www
-- create a www/index.html file
npx cap add android
ionic serve #check everything runs OK in a browser then ^C
#line below stops a warning in the Windows Android Studio when the App is run.
mkdir node_modules/#capacitor/android/capacitor/build/intermediates/check_manifest_result/debug/checkDebugManifest/out
On Windows:
Run Android Studio
Select photo-app
build it
Create an Android Virtual Machine - using Pixel XL with Android 10
Select it
Run photo-app <-- just a blank screen
Connect phone (Umidigi A3S running Android 10)
Select phone
Run photo-app <-- just shows the splash screen then a blank screen
As I am new to Android, it is probably something I'm doing wrong, but as this is an example React app I can't figure out what.
It turns out I made two simple errors:
In capacitor.config.json the webDir should be set to "build"
Ionic serve only does the build for the web service, to build for the android target you need to do:
npm run build
then run the Android Studio on the Windows side.
I'm using angular, but ran into the same situation. For me it was my (Windows) firewall blocking port 8100.
So I added the Inbound rule to allow TCP traffic on port 8100 (Private and Domain, NOT public).
Next problem was that my WiFi was, by default, set to a public WiFi... So I corrected this and it all worked!
I am using react native
react-native-cli: 2.0.1
react-native: 0.55.3
I was running via
react-native run-android
The screen is always loading the app (Debugger Mode)
NOTE: It was sudden issue, it was working fine till yesterday.
*PC is Restarted several time and also JS server using kill -9 PID
I've met this error before when I started to programming React Native on Ubuntu.
The reason why you got this error because your Genymotion didn't have same port with local machine.
So here is the solution:
Open the Developer Menu of mobile app on Genymotion
Choose the Debug Server port & port for device
Set the value localhost:8081
reload the app and enable the Debug. Now you can debug the app.
Cheer!
Maybe it is a problem with the app already installed in your phone.
Try running :
adb uninstall com.yourproject
This will install all of your project packages for all users on your emulator/phone
Temporary fix:
REACT_TERMINAL=<your terminal> react-native run-android
in my case with manjaro + xfce4:
REACT_TERMINAL=xfce4-terminal react-native run-android
or puts in your .bashrc:
export REACT_TERMINAL=xfce4-terminal
I've developed an app using Create-React-Native-App and usually would test the work using 'npm run android' where Expo client is installed on my device which would load the app once my laptop and mobile is on same WiFi network.
When I used create-react-native-app, the directory structure it laid down looks like this (src directory is created by me):
appDirectory\
--.expo\
--node_modules\
--src\
--.bablerc
--.flowconfig
--.gitignore
--.watchmanconfig
--.App.js
--app.json
--App.test.js
--package.json
--README.md
--yarn.lock
Now that I am done developing the app, I tried running this command: react-native run-android to install an APK to my device and create environment for both Android and iOS with their respective entry points like index.android.js/index.ios.js but I don't see any of this and all I get as output is:
Scanning folders for symlinks in D:\ROHIT\Projects\appDirectory\node_modules (141ms)
Please help me out with this as I am pretty new to React-Native and unable to understand to generate APK for testing and production, to be installed on various devices for pilot testing
Thanks and best,
Rohit