ionic run browser --livereload not working

Question

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

Riven

the syntaxis is ionic run browser --livereload. If it doesnt work, check the workarounds at github.com/driftyco/ionic-cli/issues/790 – Courthouse

i tried ionic run browser --livereload but the same behavior. P.S. there isnt any workaround mentioned on that page – Riven

workaround: after the change, wait until when the console shows the file changed and then rsync -rtv www/ platforms/browser/www or run another file watcher: fswatch -r www/ | xargs -I % rsync -rtv www/ platforms/browser/www workaround 2 ./node_modules/.bin/ionic-app-scripts serve --sourceMap source-map --iscordovaserve --wwwDir platforms/browser/www/ --buildDir platforms/browser/www/build – Courthouse

Answer 1

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

Riven

ionic-app-scripts serve is not the same as ionic cordova run browser as it does not support cordova plugins (while at least some of the plugins are supported for browser platform) – Machinate

I'm sorry only now I get that this is a workaround to use the browser build and can confirm it works for me. I'd add to the answer explicit statement that this way we can have the cordova plugins and the browser platform working in a same way as for cordova run browser – Machinate

Perfectly solved the issue mentionned in the question, thanks – Bashibazouk

@MathieuCastets Ionic 2 is tagged in the question. – Riven

Works perfectly, and now I can use cordova-plugin-googlemaps (native map) on browser with live reload – Sellars

Answer 2

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

Eras

Opening on 8000 is not the same as 8100 because, cordova is not running on 8100. The app on 8000 will have cordova in it. – Jemappes

indeed on 8100 the plugin proxies are not created – Machinate

Worked for me anyway. sql plugin works on 8100 and not 8000 – Repulsive

Ups! Yeah: 8100 is right, not 8100. :| Many thanks, my Friend! – Potent

Answer 3

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

Theomancy

Answer 4

Try This

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

Orometer

For the benefit of others that find your answer, would you be able to explain why your solution works for this question? – Cetus

Answer 5

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

Gillespie

Answer 6

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

Retinite

cordova is not loaded in ionic serve – Riven

browser is a platform ionic serve does not emulate/builds as browser platform – Courthouse