How to debug Ionic app stack at white screen? - android

I have built an ionic app. When I serve it via ionic serve (on browser), everything runs as expected. But when I do build it for android the app loads, shows the splash-screen and then just a blank white screen.
I have built the same app as configured (the cordova part) and replaced the src folder with the boilerplate that comes when you initialize a new app with ionic start and it runs just fine. Leading me to conclude that the problem is in my javascript code.
I would like to know how to debug this and how to find the console output when the device is running on an actual device. Is it possible to view the errors via adb and specifically when running on android?
Any Help please
My system information:
Cordova CLI: 6.5.0
Ionic Framework Version: 2.0.0
Ionic CLI Version: 2.2.1
Ionic App Lib Version: 2.1.7
Ionic App Scripts Version: 1.0.0
OS: Linux 4.8
Node Version: v7.6.0

You can do through 2 ways:
1. IONIC RUN COMMAND
Run your application with the following command:
ionic run ios --livereload --consolelogs
this let you see the errors at the console and fix them up.
Here there is more documentation
http://gonehybrid.com/how-to-debug-the-white-screen-of-death-in-your-ionic-app/
2. CHROME
Additionally you can debug your app with Chrome, if you're running your app into an ADV or compiling in a device connect to your PC, open your browser and type in navbar chrome://inspect/ here will appear the list of webviews, here must appear your app and you can launch the Debug tools.

Related

How to run cli created cordova project, in visual studio?

I have created a cordova project using command line and running everything using VS code. But, the problem is now I want to push my app to playstore and that I cannot do with VS Code. So for that I want to run my project in Visual Studio 2017. Is there anyway to run the CLI generated cordova app in visual studio.
Here are a couple links related to running a Cordova App in VS. Seems like you'll have to plug in an android device, run an android emulator, or run it in a browser:
https://learn.microsoft.com/en-us/visualstudio/cross-platform/tools-for-cordova/run-your-app/run-app-android?view=toolsforcordova-2017#google-android-emulator

Ionic application : Android --livereload shows cordova not available error

I am creating an ionic app...
I tried to run the application using ionic serve which shows:
Runtime error: Uncaught(in promise):cordova_not_available
Then I have added browser platform and run using ionic cordova run browser
Then I got no error in browser but no action too, in console I found cant open sqlite database.
Then I added Android platform and run using ionic cordova run android
Everything works fine...
I thought to reload the application without running every time so I run using ionic cordova run android --livereload
then I got the same first error:
Runtime error: Uncaught(in promise):cordova_not_available
So I couldn't figure out what mistake I have exactly done with cordova. Why is it showing a different error each time?
You should use the following commands in CLI
if you want to emulate in Android with console logs and server logs use this:
$ ionic emulate android --livereload --consolelogs --serverlogs
to just run on android use this:
$ ionic run android -l -c -s
First go through this
If you want the plugin to work for the browser you should add platform browser and run it:
ionic cordova platform add browser
and run it:
ionic cordova run browser
instead of ionic serve
If all these above not works try re-installing cordova by the following command:
npm install -g cordova
and check the installed version using below command:
cordova --version

ionic cordova run android --prod events not working properly

I have installed ion2-calendar in my ionic application using npm install ion2-calendar moment --save and i have made some changes on its files located in node_modules/ion2-calendar/dist/components/month.component.js, i have added (panEnd) and (panStart) in its dates.it is working good using ionic serve and ionic cordova run android.but the events are not working when we make build usinng --prod option like
ionic cordova run android --prod
the build was successfull and we can run the app on mobile,but the added event does not works.is there anything we need to do to add this changees in production build?
I had the same situation but I solved this doing this step and rebuilding the project for production.
try production build commands
after removing local page module file (i.e login.module.ts) of each of your page!
I mean do this
To
NOTE!! if that does not work for your do post your logs by testing your device logs using
CHROME DEV tools. you can inspect device logs there using
chrome://inspect/#devices
make sure you are using ADB drivers for your android on your machine!
you won't require this for IOS though you can directly check your log commands in XCODE Console!

Cannot Emulate Ionic v1 app to Android Emulator

I am developing an ionic app. And I want to emulate it on real Android device. I already downloaded the Android Studio. I plugged my Android device and when I tried to run this command ionic cordova run android There's a lot of errors.
Note: I am on Windows 8.1 32bit. JDK 32 bit.
This is for an academic thesis.
This is the error:
Have you enabled usb debugging on your device? You'll have to enable developer mode on your Android. Google can tell you how, but you just go to settings/about/build number, tap 7 or 8 times... Then, you should be able to use ionic run android --device. That should build out to emulate so long as you've installed the Android sdk.
It can be solved by removing platforms, then add again.
ionic cordova platform rm android
ionic cordova platform add android
if above solution does not work please run following command,
ionic cordova run android --livereload
If still problem persist,run same command with --verbose options,
ionic cordova run android --verbose
Alternatively , and way faster , you can build your app then drag/drop it inside the emulator (running aside)..it will install quicker and run sleeker.
And you'll have peace of mind , I know this is not what you're looking for ,but still a nice hack if you're time-bound.
I already solved my problem! As we can see in the error that I posted, it is the gradle file! It is corrupted download. What I did is delete the .gradle folder and run ionic cordova run adnroid. In that way, it will automatically download the gradle file! Thanks for the replies by the way!

Android emulator does not install app when using 'ionic emulate android' command

I am new to Ionic and Android programming, so I am sorry if there are any inconveniences.
My problem is that I can't see my app (default app in tutorial) on the emulated android virtual device. It just shows a stock android phone basically after I run ionic emulate android. So I assume the app wasn't installed on the emulator.
It builds the apk but doesn't do anything with it it seems.
I think I installed everythink correctly:
> duc#duc-ThinkPad-T450s:~/myApp$ ionic info Your system information:
> Cordova CLI: 6.0.0 Ionic Version: 1.2.4 Ionic CLI Version: 1.7.14
> Ionic App Lib Version: 0.7.0 OS: Distributor ID: Ubuntu Description:
> Ubuntu 14.04.4 LTS Node Version: v4.4.1
I hope you could help me out, just wanted to get the tutorial going :)
Greets, Duc
Edit:
I finally managed to install the apk manually to the emulated device
using this command:
adb -s <your emulator> install </your/apk/path>
However installing it manually is very inconvenient and annoying.
Anyone has a solution for this?
Problem solved!
You have to write in the commandline:
android avd
Then a menu pops up and you have to create your own avd, then start it
Then you need to open a new terminal (ctrl+alt+t).
Cd to the right path of your app.
Now ionic emulate android should work.
You can also use third-party emulator like Genymotion (which works much faster).
Use ionic build android and just drag build APK /platforms/android/build/outputs/apk/android-debug.apk to Genymotion emulator.

Categories

Resources