dezman
dezman

Reputation: 19388

LiveReload with Grunt?

I've consulted this answer as a starting point, in addition to the watch github page.

My watch task looks like this:

watch: {
  less: {
    files: ['less/**/*.less'],
    tasks: ['less'],
    options: {
      livereload: true
    }
  },
  handlebars: {
    files: ['templates/**/*.hbs'],
    tasks: ['handlebars'],
    options: {
      livereload: true
    }
  }
}

First I tried with the browser extension, and then later I added this script (and verified that it is loaded) in my index.html

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

I also tried adding this to my watch js:

livereload: {
  files: ['dev/**/*'],
  options: {
    livereload: true
  }
}

I also have a connect task, and I've tried running grunt with or without it to no avail.

connect: {
  dev: {
    options: {
      port: 35729
    }
  }
}

And still no live-reload...

Upvotes: 1

Views: 524

Answers (3)

strivek
strivek

Reputation: 11

this is my Gruntfile.js and my connect version is 0.9.0, this config can use for different livereroad port

module.exports = function (grunt) {

require('load-grunt-tasks')(grunt);
require('time-grunt')(grunt);
grunt.initConfig({
    watch: {
        demo: {
            files: ['web/*.*'],
            options: {
                livereload: 5000
            }
        },
        dev:{
            files: ['web1/*.*'],
            options: {
                livereload: 3030
            }
        }
    },
    connect: {
        demo: {
            options: {
                base: "web",
                port: 1111,
                hostname: '*',
                livereload: 5000,
                open: {
                    target: 'http://127.0.0.1:1111'
                }
            }
        },
        dev:{
            options: {
                base: "web1",
                port: 2222,
                hostname: '*',
                livereload: 3030,
                open: {
                    target: 'http://127.0.0.1:2222'
                }
            }
        }
    }
})
grunt.registerTask('demo', ['connect:demo', 'watch:demo']);
grunt.registerTask('dev',['connect:dev','watch:dev']);

}

Upvotes: 1

Mark Simon
Mark Simon

Reputation: 762

Watch has worked for me out of the box, without livereload. Have you tried removing the livereload options and the script include?

Then: grunt; grunt watch

(the default task does the build, then watch keeps an eye out for changes)

Upvotes: 0

ed.
ed.

Reputation: 2706

Does this work?

watch: {
  options: { livereload: true },
  less: {
    files: ['less/**/*.less'],
    tasks: ['less']
  },
  //...
}

Also try running in verbose mode (grunt do-something -v) to check that the livereload server starts and that the port is correct.

Upvotes: 0

Related Questions