ionic run browser --livereload not working - ionic-framework

i was trying to use live reload on my ionic 2 application. so i found this command
ionic run browser --live-reload
is not working as expected and while making code changes i am receiving console messages
[16:12:47] build started ...
[16:12:47] transpile update started ...
[16:12:47] transpile update finished in 46 ms
[16:12:47] deeplinks update started ...
[16:12:47] deeplinks update finished in 248 ms
[16:12:47] webpack update started ...
but the page isn't reloading

i found the solution on the github page
include a script in the package.json file
"browser": "ionic-app-scripts serve --sourceMap source-map --iscordovaserve --wwwDir platforms/browser/www/ --buildDir platforms/browser/www/build"
and run
npm run browser

When you run the command ionic cordova run browser --livereload you will see something like this in CLI:
[19:39:00] dev server running: http://localhost:8100/
[INFO] Development server running
Local: http://localhost:8100
External: http://192.168.0.51:8100
Just open http://192.168.0.51:8100 or http://localhost:8100 and your live reload will work on that address. Your browser might have opened in http://localhost:8000 instead of 8100

First off, should anyone need this answer, the command has been renamed in the later version to
ionic cordova run browser
Second, The --livereload flag is not supported when you run this command. this issue explains more

Try This
ionic cordova run browser --livereload --consolelogs --serverlogs

"serve": "npx ionic serve --cordova --platform browser"

Using this command browser will be reloaded automatically.
ionic serve
If you want to run application with different platform in browser you can use this command :
ionic serve -l
This both command will reload page automatically on code change

Related

ionic info command exits without any error

I got a new laptop and I installed node, ionic and angular. I added ANDROID_SDK_HOME, ANDROID_HOME and JAVA_HOME in environment. ionic version is 6.20.2, node version is v16.17.1 and angular version is 14.2.4 and npm version is 8.15.0. When I use ionic serve, application opens in browser. But when I use ionic info, it exits without any error. Same happens when I try ionic cap build android.
I had a similar error when generating the build for Android, the command ended without any error message or warning.
After many tests it was only solved by downgrading.
npm install --global #ionic/cli#6.20.1

Debugging Ionic 4 App in Appium WebdriverIO not working : WebView missing

I am trying to debug an Ionic 4 app using Appium & WebdriverIO. I am receiving feedback that I need to enable Webview in my app in order for this to work. The problem is I cannot find a single reference as to how to do this in Ionic anywhere.
I have also attempted to run my app in Browserstack where for the same reason, it won't run at all.
Can someone from Ionic comment on the correct approach to this, that will work for Android and iOS platforms, based on the same Ionic code.
The solution comes in a few steps.
1 - Enable Webview
In the config.xml file, make sure you set the following:
<preference name="WKWebViewOnly" value="true" />
This has the effect of setting :
<application
android:debuggable="true"
2 - Debug Build
In addition to point 1, note that for a production release build, we use the command :
$ ionic cordova build android --prod --release
However, Android does something clever behind the scenes in that this build can only be debugged locally for security reasons. So, no matter what you do, when you try and run this up in Browserstack, it will not provide webview as a context. We fix this by using the debug build flag:
$ ionic cordova build android --prod --debug
3 - Bonus Bug
Unfortunately, there is a bug in the Android Debug build process. So there is one more step to cover. You have to run zipalign twice when you're working on the debug build. Don't ask me why! You just do...
Debug > "%ANDROID_HOME%\build-tools\28.0.3\zipalign" -f 4 app-debug.apk temp.apk // zip-align
Debug > "%ANDROID_HOME%\build-tools\28.0.3\zipalign" -f 4 temp.apk SensorNode.apk // need to do it twice because of android bug!!!
Debug > "%ANDROID_HOME%\build-tools\28.0.3\apksigner" sign --ks my-release-key.jks --v1-signing-enabled true --v2-signing-enabled true SensorNode.apk

Electron run by Capacitor in Ionic 5: console logging and live reload not working

I've used Electron standalone before, and console.log() commands in main.js worked just fine (output to IDE console) and the electron-reload module also worked fine when content changes were detected in the Electron root folder.
I've now started a new Ionic 5 project, and added Electron to the project via Capacitor. Capacitor makes a few necessary changes to Electron (e.g. renaming main.js to index.js etc), I've now also have to start electron via capacitor npx cap open electron.
In doing so, console.log() commands in index.js are now NOT being output to the IDE console, errors are not being output to console, and the electron-reload module now serves a blank page when changes are detected… the only console output that I get is:
$ npx cap open electron
[info] Opening Electron project at ...
Is this a capacitor limitation or what configurations must be done to make this work ?
#ionic/cli#6.10.0
#capacitor/core#2.2.0
electron#8.3.1
also updated electron to latest 9.0.4 - same result.
here are steps to reproduce this:
# install ionic CLI
$ npm install -g #ionic/cli
# create project w/ capacitor
$ ionic start <project name> blank --type=angular --capacitor
# create initial build, needed by cap for electron
$ cd <ionic_project_folder>
$ ionic build
# add electron via cap
$ npx cap add electron
# run electron
$ npx cap open electron
if you enter console.log messages in electron’s index.js, none of them will be logged…
figured it out. Capacitor blocks all log messages by default, but you can run npm run electron:start from within the /electron folder and you'll get all log messages... HTH someone.

How to make a prod build in "Ionic upload" command?

I want to use Ionic deploy service in Ionic cloud.
When I run ionic upload command, a dev build is immediately triggered instead of prod build.
Is it possible to create a --prod build and upload?
One of major reasons is that multiple configurations in my code are bundled with --prod build only.
ionic upload --deploy=dev
[INFO] Running app-scripts build:
[09:55:59] build dev started ...
[09:55:59] clean started ...
[09:55:59] clean finished in 1 ms
You could pipe the npm scripts to run the ionic --prod first and then ionic upload
"scripts":{
"custom-upload":"ionic cordova build --prod | ionic upload"
}
and then run in the terminal
$: npm custom-upload
This will still run the dev build i think but your prod build should be packaged as well. It does not look like you can specify a build type in the ionic upload command, which makes me think that the ionic upload does not upload the production build to ionic view. And if that is that case then you might want to consider changing the configurations setup in a prod build to be set to only be used if not on localhost instead on based on the build.

Error with Spawned command: npminstall

I am trying to run a sample application from
https://ionicframework.com/getting-started/.
But I am getting the error - there was an error with the spawned process: npminstall every time I try to run the application. Any help is highly appreciated.
For me it was only to upgrade to new version of npm
npm install -g npm
Spawned command error comes when you try to start a new ionic or cordova app, that gets downloaded from git. This error occurs because your network proxy blocks download a new blank app from git.
To avoid such kind of error try removing the proxies.
1. If you are in a company using their proxy its not possible to do that, so use your own data to do that.
Try downloading a blank app from git using your own data, don't use company network which has proxy enabled.
It will download but while installing the app you will get error like:
Error with start undefined.
Error with spawned command npminstall.
Don't worry a folder will be downloded,
Go to cmd and go inside that app directory and run ionic serve
It will give error like ionic.config.json file didn't find.
create a file with the name ionic.config.json inside the app file.
inside that file paste the following:
{ "name": "your app name", "app_id": "", "v2": true, "typescript": true }
now try running the command ionic serve
your app will run.
I had the similar problem but it worked for me.
install npm globally
npm install -g npm
create a app without installing its packages
ionic start app --v2 --skip-npm
seems ok till now?then
cd app
install packages
npm install --save
done!try to start your ionic app
ionic serve