Ionic: Live Reload & Console Logging in the Simulator
Here’s a quick tip for those using the Ionic Framework:
Say you’re building your application up, and have been using ionic serve
to serve your application to your browser for testing.
Using ionic serve
can be all well and good, until of course, you want to harness any of your mobile device’s functionality using Cordova. Cordova plugins don’t work in your browser, because they are built to access a device-based API (like camera, for example).
So the next thing you do is use the ionic emulate
command to run your app in a real device emulator. In the case of iOS, we have iOS Simulator, which we could run with ionic emulate ios
.
Great, but now we’re losing some of the benefits of ionic serve
– most notably, Live Reload and console logging.
With Live Reload, the productivity boost of being able to make small changes without re-serving the app is clear. With console logging, it is especially useful to have output when it comes to JavaScript-based errors – something that emulators like iOS Simulator won’t provide.
The good news is, Live Reload and console logging are now available to ionic emulate
in beta. Just add the Live Reload and console logging flags:
ionic emulate ios -l -c
And, for example, I can now see the error of my JavaScript ways in the command line output:
If you’re anything like me, these two features alone can save up to hours fixing bugs. Hats off to the Ionic team for making it happen!
Read more on the Ionic Framework website — including more optional flags you can use. Enjoy!