Yeoman: Triggering LiveReload on change of SCSS files

Question

I've got the latest yeoman stack, and I just upgraded generator-webapp to master as per: https://github.com/yeoman/generator-webapp/pull/67 to get livereload working properly.

HTML files and css files seem to be working with livereload just fine, but scss files don't trigger a reload. Here's a snippet of output:

OK
>> File "app/index.html" changed.


Running "watch" task
... Reload app/index.html ...
... Reload app/index.html ...
Completed in 0.005s at Wed Jun 05 2013 22:45:46 GMT+0100 (BST) - Waiting...
OK
>> File "app/styles/main.scss" changed.


Running "compass:server" (compass) task
overwrite .tmp/styles/main.css 

Running "watch" task
Completed in 1.101s at Wed Jun 05 2013 22:45:57 GMT+0100 (BST) - Waiting...

The scss file is being watched and compiled, but it looks as though the outputted css in .tmp is being ignored. This is despite the following in the (default) Gruntfile.

        livereload: {
            options: {
                livereload: LIVERELOAD_PORT
            },
            files: [
                '<%= yeoman.app %>/*.html',
                '{.tmp,<%= yeoman.app %>}/styles/{,*/}*.css',
                '{.tmp,<%= yeoman.app %>}/scripts/{,*/}*.js',
                '<%= yeoman.app %>/images/{,*/}*.{png,jpg,jpeg,gif,webp,svg}'
            ]
        }

I would post this as a bug on github, but it's difficult to know which part of the stack is responsible.

Answer 1

Try setting

watch: {
  options: {
    nospawn: false
  }
}

Let me know if this does the trick!