Problem with serving Ionic 3 app in browser - ionic-framework

I have huge problems when serving app in browser.
Upon running it prompts with 'gap_init:3'
I know it means android code is deployed in browser , which is wrong.
First run on device is fine. But next time I run it in browser I got this annoying error
Here are my npm commands with Ionic info bellow
"serve": "ionic-app-scripts serve --sourceMap source-map --iscordovaserve --wwwDir platforms/browser/www/ --buildDir platforms/browser/www/build"
"run": "ionic cordova run android --device --enableLint false "
Ionic info:
Ionic CLI : 5.4.13 (C:\Users\xxx\AppData\Roaming\nvm\v10.15.3\node_modules\ionic)
Ionic Framework : ionic-angular 3.9.3
#ionic/app-scripts : 3.2.4
Cordova:
Cordova CLI : 9.0.0 (cordova-lib#9.0.1)
Cordova Platforms : not available
Cordova Plugins : not available
Utility:
cordova-res (update available: 0.8.1) : 0.6.0
native-run (update available: 0.3.0) : 0.2.8
System:
Android SDK Tools : 26.1.1 (e:\Android\SDK)
NodeJS : v10.15.3 (C:\Program Files\nodejs\node.exe)
npm : 6.4.1
OS : Windows 10

Related

Capacitor - Uncaught TypeError: cap.[some_function] is not a function

I just upgraded capacitor to 3.2.x and when I try to build my Ionic project, almost no capacitor function seems to work. For example, I get errors like:
Uncaught TypeError: cap.nativeCallback is not a function
...
Uncaught TypeError: Capacitor.createEvent is not a function
...
package com.getcapacitor.annotation does not exist
Here's my Ionic Info:
Ionic:
Ionic CLI : 6.17.1 (/usr/local/lib/node_modules/#ionic/cli)
Ionic Framework : #ionic/angular 5.5.2
#angular-devkit/build-angular : 0.1000.8
#angular-devkit/schematics : 10.0.8
#angular/cli : 10.0.8
#ionic/angular-toolkit : 2.3.3
Capacitor:
Capacitor CLI : 3.2.3
#capacitor/android : 3.0.0-beta.3
#capacitor/core : 3.2.3
#capacitor/ios : not installed
Cordova:
Cordova CLI : 10.0.0
Cordova Platforms : android 9.1.0
Cordova Plugins : cordova-plugin-ionic-keyboard 2.2.0, cordova-plugin-ionic-webview 4.2.1, (and 9 other plugins)
Utility:
cordova-res : 0.15.3
native-run : 1.4.1
System:
Android SDK Tools : 26.1.1 (/home/che-azeh/Android/Sdk)
NodeJS : v12.21.0 (/usr/bin/node)
npm : 7.5.2
OS : Linux 5.11
Here was the problem: if you look at the capacitor section under my Ionic Info, you'd notice an incosistency between Capacitor CLI, #capaciotr/core and #capacitor/android:
Capacitor:
Capacitor CLI : 3.2.3
#capacitor/android : 3.0.0-beta.3
#capacitor/core : 3.2.3
So what I did was upgrade all 3 to their latest versions:
npm install #capacitor/cli#latest #capacitor/core#latest
npm install #capacitor/android#latest
Now, it looks ike:
Capacitor:
Capacitor CLI : 3.2.3
#capacitor/android : 3.2.3
#capacitor/core : 3.2.3
Finally, I remove the Android folder created by capacitor (rm -R ./android), reinitialize capacitor (npx cap init) rebuild ionic project (ionic build android) and then npx cap add android.
And solved! Zero errors!

Ionic 4 app shows api data in browser but on device it doen't shows api data

When I run Ionic 4 app, the browser shows api data but when i run same app on android device it doen't shows api data.
I am using Laravel as a backend, from where i am fetching api data.
The Ionic info is -
Ionic:
Ionic CLI : 6.5.0 (C:\Users\LENOVO\AppData\Roaming\npm\node_modules\#ionic\cli)
Ionic Framework : #ionic/angular 4.1.1
#angular-devkit/build-angular : 0.803.26
#angular-devkit/schematics : 8.3.26
#angular/cli : 8.3.26
#ionic/angular-toolkit : 2.2.0
Cordova:
Cordova CLI : not installed
Cordova Platforms : android 7.1.4
Cordova Plugins : cordova-plugin-ionic-keyboard 2.2.0, cordova-plugin-ionic-webview 4.1.3, (and 4 other plugins)
Utility:
cordova-res : not installed
native-run : 1.0.0
System:
NodeJS : v12.16.1 (C:\Program Files (x86)\nodejs\node.exe)
npm : 6.13.4
OS : Windows 10
I am really stuck here...
Your Problem is Cors you can install middleware in laravel to avoide the problem
Or you can test your application in the chrome disable securite
Try to Run :
chrome.exe --user-data-dir="C://Chrome dev session" --disable-web-security
and test your application in this chrome and let me khnow

Ionic live-reload executes twice on save

Every time I make a change to my code, live-reload executes twice. The first reload is quick (< 1 second), then there is a pause, then another reload fires and takes substantially longer (2 - 3 seconds).
When I create a fresh Ionic starter app, I don't get this problem. I have tried different IDEs and get the same result.
My ionic info:
Ionic:
ionic (Ionic CLI) : 4.12.0
Ionic Framework : ionic-angular 3.9.5
#ionic/app-scripts : 3.2.2
Cordova:
cordova (Cordova CLI) : 8.1.2 (cordova-lib#8.1.1)
Cordova Platforms : none
Cordova Plugins : no whitelisted plugins (0 plugins total)
System:
Android SDK Tools : 26.1.1 (/Users/alexandrsteinberg/Library/Android/sdk)
ios-deploy : 2.0.0
NodeJS : v8.12.0 (/Users/alexandrsteinberg/.nvm/versions/node/v8.12.0/bin/node)
npm : 6.4.1
OS : macOS Mojave
Xcode : Xcode 10.2.1 Build version 10E1001

Problems to emulate after Xcode update

After update my Xcode from 10.1 to 10.2, I have problem to emulate the app on ios emulators.
After I run $ ionic cordova emulate ios -l, I get this:
BUILD SUCCEEDED
[cordova]
[cordova] No target specified for emulator. Deploying to undefined simulator
[cordova] Device type "com.apple.CoreSimulator.SimDeviceType.undefined" could not be found.
[ERROR] An error occurred while running subprocess cordova.
$ ionic cordova emulate ios --list
Available ios virtual devices:
So I've did
$ cd platforms/ios/cordova/ && npm i ios-sim#latest
But, I keep getting No target specified for emulator. Deploying to undefined simulator, just like before.
I also tried instal the next version of ios-sim, but I think it's compatible.
$ ionic info
Ionic:
ionic (Ionic CLI) : 4.12.0 (/Users/jeansilva/.nvm/versions/node/v8.12.0/lib/node_modules/ionic)
Ionic Framework : ionic-angular 3.9.2
#ionic/app-scripts : 3.2.3
Cordova:
cordova (Cordova CLI) : 8.0.0
Cordova Platforms : ios 4.5.5
Cordova Plugins : no whitelisted plugins (13 plugins total)
System:
Android SDK Tools : 26.1.1 (/Users/jeansilva/Library/Android/sdk/)
ios-deploy : 1.9.4
ios-sim : ios-sim/9.0.0-dev.1 darwin-x64 node-v8.12.0
NodeJS : v8.12.0 (/Users/jeansilva/.nvm/versions/node/v8.12.0/bin/node)
npm : 6.4.1
OS : macOS Mojave
Xcode : Xcode 10.2 Build version 10E125
Faced similar problem, after hours of making app run on simulator following command works for me
ionic cordova emulate ios --livereload --consolelogs --target="iPhone-6,com.apple.CoreSimulator.SimRuntime.iOS-10-1"
or you can try this if above don't work
ionic cordova emulate ios --livereload --consolelogs --target="iPhone-6,com.apple.CoreSimulator.SimRuntime.iOS-10-1" --buildFlag="-UseModernBuildSystem=0"
Let me know if it doesn't solve your issue.

Ionic serve taking too much time like 4 to 6 minutes while compiling ionic 3 project

I am using ionic-3 and when I am compiling ionic project through ionic serve command, Its taking 4-6 mins for me.
Versions of following components:
#ionic/cli-utils : 1.19.2
ionic (Ionic CLI) : 3.20.0
global packages:
cordova (Cordova CLI) : 7.0.1
local packages:
#ionic/app-scripts : 2.1.4
Cordova Platforms : android 7.1.0
Ionic Framework : ionic-angular 3.7.1
System:
Android SDK Tools : 26.1.1
Node : v7.10.1
npm : 5.4.2
OS : Linux 4.4
Environment Variables:
ANDROID_HOME : /home/spaneos/Android/Sdk
Misc:
backend : pro
node version: 7.10.0
npm version: 5.4.2
It depends on your system specification. If you have a higher config machine then it will take less time. I hope you got the point.