Browser not reloading with Grunt Livereload

Question

I trying to add livereload of broser when changing my files, but browser not reloading, and I cant get why, I do all like described here, and browser opens when I tun grunt, then when change index.html, in console getting

Waiting...
>> File "index.html" changed.
Completed in 0.000s at Wed Jun 03 2015 11:45:24 GMT+0300 (EEST) -  Waiting...
>> File "index.html" changed.
Completed in 0.000s at Wed Jun 03 2015 11:54:11 GMT+0300 (EEST) - Waiting...
>> File "index.html" changed.
Completed in 0.000s at Wed Jun 03 2015 12:01:30 GMT+0300 (EEST) -     Waiting...

but browser not reloading, what I am doing wrong? Maybe I miss something? I trying to Googling problem but didnt get any helpful results... If you need my Gruntfile or any, just say to me. Thanks!

Here is my Gruntfile.js :

module.exports = function(grunt) {
// Load Grunt tasks declared in the package.json file
require('matchdep').filterDev('grunt-*').forEach(grunt.loadNpmTasks);
// Configure Grunt
grunt.initConfig({
// Grunt express - our webserver
// https://github.com/blai/grunt-express
express: {
    all: {
        options: {
            bases: ['var\\www\\megapolis'],
            port: 8080,
            hostname: "localhost",
            livereload: true
        }
    }
},
// grunt-watch will monitor the projects files
// https://github.com/gruntjs/grunt-contrib-watch
watch: {
    all: {
            files: '**/*.html',
            options: {
                livereload: true
        }
    }
},
// grunt-open will open your browser at the project's URL
// https://www.npmjs.org/package/grunt-open
open: {
    all: {
        path: 'http://localhost/megapolis/index.html'
    }
}
});
// Creates the `server` task
grunt.registerTask('server', [
    'express',
    'open',
    'watch'
    ]);
};

Please include the relevant sections of your grunt file so we can see exactly how you are attempting to accomplish this. — Lix, Jun 03 '15 at 09:12
You are not using an AppCache manifest in your index.html are you? If you use an offline cache, the browser will not reload. I had this problem last week. — Jonathan Smith, Jun 03 '15 at 09:13

score 1 · Accepted Answer · answered Jun 03 '15 at 11:03

1

Maybe the cause is that your grunt-open plugin is not configured with the same port as the express server. The grunt-open plugin is using the default 80 port while express is configured on the 8080.

Try appending the same 8080 port as in express configuration:

// grunt-open will open your browser at the project's URL
// https://www.npmjs.org/package/grunt-open
open: {
    all: {
        path: 'http://localhost:8080/megapolis/index.html'
    }
}

answered Jun 03 '15 at 11:03

dreyescat

13,558
5
50
38

getting `Cannot GET /megapolis/index.html` – nowiko Jun 03 '15 at 11:19
Are your running `grunt server` inside `var\\www\\megapolis` or `var\\www` ? And the `index.html` file resides in the `var\\www\\megapolis` folder ? – dreyescat Jun 03 '15 at 11:40
I run command inside megapolis folder, and index.html lay in the same directory – nowiko Jun 03 '15 at 11:53
Try to remove `megapolis` from the *grunt-open* configuration as it already in the `bases`. Like this `http://localhost:8080/index.html`. Does it work? – dreyescat Jun 03 '15 at 11:54
I found solution, I just need to add this into my `index.html`: `` – nowiko Jun 03 '15 at 12:35
Nice you found the issue. I thought that the livereload script snippet was injected automatically. At least it is for me :). Does your `index.html` has a `body`? – dreyescat Jun 03 '15 at 12:53
Yes `body` exists on page. Actually I can install plugin fro Chrome, but I choice `script`... I read that in official docs, because how you can see in tutorial it not mentioned... – nowiko Jun 03 '15 at 14:38

Browser not reloading with Grunt Livereload

1 Answers1