Rakefile

require 'rake/clean'

HAML   = FileList['**/*.haml']
LESS   = FileList['**/*.less']
COFFEE = FileList['**/*.coffee']

HTML = HAML.ext('html')
CSS  = LESS.ext('css')
JS   = COFFEE.ext('js')

CLOBBER.include(HTML, CSS, JS)

rule '.html' => '.haml' do |t|
   puts "  HAML #{t.source}"
   sh 'haml', t.source, t.name
end

rule '.css' => '.less' do |t|
   puts "  LESS #{t.source}"
   sh 'lessc', t.source, t.name
end

rule '.js' => '.coffee' do |t|
   puts "COFFEE #{t.source}"
   sh 'coffee', '-c', t.source
end

desc "Build all HTML, CSS and JavaScript files"
task :default => (HTML + CSS + JS)

desc "Continuously watch for changes and rebuild files"
task :watch => [:default] do
    require 'rubygems'
    require 'fssm'

    def rebuild
        sh 'rake'
        puts "    OK"
    rescue
        nil
    end

    begin
        FSSM.monitor(nil, ['**/*.coffee', '**/*.haml', '**/*.less']) do
            update { rebuild }
            delete { rebuild }
            create { rebuild }
        end
    rescue FSSM::CallbackError => e
        Process.exit
    end
end

@flov Certainly there is. I'm not using SASS, but you can use LessCSS support as an example. If anyone is using this with SASS, can you please post your Rakefile?

I wanted to write a watcher to render Sass, but livereload worked poorly in our (huge) project because EventMachine kept erroring out with the message "too many open files". I've written a small script that's a replacement for livereload gem. It's designed for Rails projects, but can easily be edited. It supports Sass.

@mislav Thanks! I had the same problem. "too many open files". Ill check it out

The watch sass command can help us while waiting for the native sass support.
Simply run "sass --watch {source_dir}:{target_dir}" while running activereload and your sass changes will be autocompiled into the css => captured by activereload => updated on your browser

I am using LESS css, in the main page it says Livereload monitors LESS files, too, only that I should use this Rakefile. How do you use this rakefile? Thanks

@niksosf Save this gist as a file named Rakefile in the root of your project and run rake watch.

Please refer to http://docs.rubyrake.org/tutorial/index.html for more info — Rake is a great tool and is worth the learning time.

@andreyvit.
Second time in a day that you saved the day. Thank you. I am reading up on Rake now. Feel silly having used Rails for 2 years without know it.

@andreyvit. -- I have just gone through the tutorial you mentioned, but here are a couple of things that are not clear I though it maybe easier to state my case here rather than on Stackoverflow. First, the Rakefile that came with the rails app already has content in it, should I overwrite it? I think it is not right if each time I get a rakefile from a gem/plugin, I have to replace existing content in the Rakefile. -- So I tried pasting the content here for LIvereload to the bottom of the Rakefile and run
rake watch
but a bunch of obviously unrelated lines show up on screen that look like rake tasks from other gems.

I read up on the tutorial that you can specify which rake file to use by rake -f "path/to/rakefile", so I did
rake -f "lib/tasks/livereload.rake" watch
I renamed the rakefile to livereload.rake. But running that just hangs and nothing happened.

I appreciate any suggestions as to what I shall try next. Thanks again

@niksosf You did everything right — according to the Rakefile above, it does not output anything when watching. Just change some file, and it should be compiled. Feel free to add some puts statements. :)

And, no, you shouldn't overwrite the Rakefile from Rails — the best approach is to keep the file where you've put it, and to require lib/rasks/livereload.rake from your main Rakefile.

The problem is in this line:

task :watch => [:default] 

It invokes the default task before watching to regenerate content, however Rails defines it own version of default task. Change both occurrences of :default to something else (e.g. :rebuild), and you should be good to go.

@andreyvit
I added the line
require 'livereload'
to the Rakefile in the root dir
And I put livereload.rake in lib/tasks/.In livereload.rake, I changed both instances of :default to rebuild. Then when I run rake watch,
nothing happens.

So I thought, maybe it's monitoring and I should edit a shared.less file to see what happens. Indeed, after I edited and saved a sample file, something did happen:
C:/Users/Nik/.pik/rubies/Ruby-187-p299/bin/ruby.exe -I"lib;test" "C:/Users/Nik/.pik/rubies/Ruby-187-p299/lib/ruby/gems/1.8/gems/rake-0.8.7/lib/rake/ra
ke_test_loader.rb"
C:/Users/Nik/.pik/rubies/Ruby-187-p299/bin/ruby.exe -I"lib;test" "C:/Users/Nik/.pik/rubies/Ruby-187-p299/lib/ruby/gems/1.8/gems/rake-0.8.7/lib/rake/ra
ke_test_loader.rb"
C:/Users/Nik/.pik/rubies/Ruby-187-p299/bin/ruby.exe -I"lib;test" "C:/Users/Nik/.pik/rubies/Ruby-187-p299/lib/ruby/gems/1.8/gems/rake-0.8.7/lib/rake/ra
ke_test_loader.rb"
OK
rake

I also have another command prompt running the livereload server and it does not say that shared.css or shared.less is update.

Then I tried removing everything in that Rakefile in the root and inserting the livereload gist, leaving the two instances of :default as they are.

And then I run
rake watch
immediately, I see
LESS app/stylesheets/sessions/shared.less
lessc app/stylesheets/sessions/shared.less app/stylesheets/sessions/shared.css

And then I went to my texteditor to change something in the shared.less and saved it. This time, I got some pretty instant response:
rake
(in c:/r/bakery)
LESS app/stylesheets/sessions/shared.less
lessc app/stylesheets/sessions/shared.less app/stylesheets/sessions/shared.css
OK
with bakery dir being my rails app dir
And I see

Modified: shared.css

in the livereload server prompt.

Unfortunately, though everything seems okay now, the webpage itself is not reloaded even when the livereload prompt detected a modification. And I made sure that the livereload is working for erb, css, html, js, and etc, while doing all the above.

I am running on Windows 7 64bit, Ruby 1.8.7.

@niksosf To avoid spamming everyone here, please contact me at [email protected] for further assistance. Also, if you are serious about web development, please stop using Windows, it will always be making things more difficult for you.