Search code examples
gruntjsgrunt-contrib-watch

Grunt Livereload through grunt-contrib-watch not refreshing browser

I'm quite new to Grunt and I'm trying to enable livereload through grunt-contrib-watch plugin, but my browser is not refreshing. This is my current Gruntfile.js:

module.exports = function(grunt) {
    grunt.initConfig({
        pkg: grunt.file.readJSON('package.json'),

        watch: {
            options: {
                livereload: true
            },
            files: ['*.html']
        }
    });

    grunt.loadNpmTasks('grunt-contrib-watch');
};

I have an index.html file in the same folder as Gruntfile.js:

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <title>Grunt example</title>
</head>
<body>
    <h1>Grunt example</h1>
    <p>A paragraph</p>
    <script src="//localhost:35729/livereload.js"></script>
</body>
</html>

So I execute "grunt watch" and after changing the index.html file I get the following message from the console:

File "index.html" changed. Completed in 0.000s at ...

But my browser is not refreshing. Am I missing anything? Is there any error?

Solution

  • Changing your script block from:

    <script src="//localhost:35729/livereload.js"></script>

    To:

    <script src="http://localhost:35729/livereload.js"></script>

    Should fix it.