How to add Live Reload when using the command cordova serve?

If you are using phonegap serve and you are seeing the JavaScript prompts, you need to add a snippet to prevent the app from loading the Native-level JavaScript code.

replace <script type="text/javascript" src="phonegap.js"></script> with

<script type="text/javascript">
    if (!navigator.userAgent.toLowerCase().match('chrome')) {
        document.write("<script src='phonegap.js'><\/script>");
    }
</script>

Note that this works for both cordova.js and phonegap.js (They should be the same file)


You can also try cordova-plugin-browsersync-gen2. It's based on old abandoned plugin, fully compatible with latest versions of npm and Cordova.

Also, this version adds missing live-reload support for the following:

cordova run (for each platform individually)
cordova serve

Easiest solution is just to use phonegap serve instead of cordova serve. As long as you've got phonegap installed it'll work even if you built the app with just cordova.

phonegap serve gives you an IP address that will live reload and that you can access from the browser or the phonegap developers app. Both are very handy and actually work, which is always a plus.


You could try the Cordova Browsersync plugin. Instructions to use the plugin are in the plugin's repo.

Once you add this plugin using cordova plugin add cordova-plugin-browsersync, you can simply use cordova run -- --live-reload to start live reload. Note that this also enables syncing scrolls and clicks if you have multiple devices.