How to do live reload with Rails 4 and Ruby 2.0 app?

Question

I want to see live changes in browser if I edit .scss or .erb file in text Editor in Rails 4 + Ruby 2.0 project.

I tried Guard and Guard-live-reload, but it's throwing the following error.

22:58:04 - ERROR - Could not load 'guard/rspec' or find class Guard::Rspec
22:58:04 - ERROR - /home/jitendra/.rvm/gems/ruby-2.1.1@global/gems/guard-2.6.1/lib/guard/plugin_util.rb:100:in `require'
> [#] /home/jitendra/.rvm/gems/ruby-2.1.1@global/gems/guard-2.6.1/lib/guard/plugin_util.rb:100:in `plugin_class'
> [#] /home/jitendra/.rvm/gems/ruby-2.1.1@global/gems/guard-2.6.1/lib/guard/plugin_util.rb:57:in `initialize_plugin'
> [#] /home/jitendra/.rvm/gems/ruby-2.1.1@global/gems/guard-2.6.1/lib/guard.rb:167:in `add_plugin'
> [#] /home/jitendra/.rvm/gems/ruby-2.1.1@global/gems/guard-2.6.1/lib/guard/dsl.rb:174:in `block in guard'
> [#] /home/jitendra/.rvm/gems/ruby-2.1.1@global/gems/guard-2.6.1/lib/guard/dsl.rb:173:in `each'
> [#] /home/jitendra/.rvm/gems/ruby-2.1.1@global/gems/guard-2.6.1/lib/guard/dsl.rb:173:in `guard'
> [#] /home/jitendra/milaap-webapp/Guardfile:4:in `_instance_eval_guardfile'
> [#] /home/jitendra/.rvm/gems/ruby-2.1.1@global/gems/guard-2.6.1/lib/guard/guardfile/evaluator.rb:97:in `instance_eval'
> [#] /home/jitendra/.rvm/gems/ruby-2.1.1@global/gems/guard-2.6.1/lib/guard/guardfile/evaluator.rb:97:in `_instance_eval_guardfile'
> [#] /home/jitendra/.rvm/gems/ruby-2.1.1@global/gems/guard-2.6.1/lib/guard/guardfile/evaluator.rb:37:in `evaluate_guardfile'
> [#] /home/jitendra/.rvm/gems/ruby-2.1.1@global/gems/guard-2.6.1/lib/guard/setuper.rb:148:in `evaluate_guardfile'
> [#] /home/jitendra/.rvm/gems/ruby-2.1.1@global/gems/guard-2.6.1/lib/guard/setuper.rb:64:in `setup'
> [#] /home/jitendra/.rvm/gems/ruby-2.1.1@global/gems/guard-2.6.1/lib/guard/commander.rb:24:in `start'
> [#] /home/jitendra/.rvm/gems/ruby-2.1.1@global/gems/guard-2.6.1/lib/guard/cli.rb:107:in `start'
> [#] /home/jitendra/.rvm/gems/ruby-2.1.1@global/gems/thor-0.19.1/lib/thor/command.rb:27:in `run'
> [#] /home/jitendra/.rvm/gems/ruby-2.1.1@global/gems/thor-0.19.1/lib/thor/invocation.rb:126:in `invoke_command'
> [#] /home/jitendra/.rvm/gems/ruby-2.1.1@global/gems/thor-0.19.1/lib/thor.rb:359:in `dispatch'
> [#] /home/jitendra/.rvm/gems/ruby-2.1.1@global/gems/thor-0.19.1/lib/thor/base.rb:440:in `start'
> [#] /home/jitendra/.rvm/gems/ruby-2.1.1@global/gems/guard-2.6.1/bin/guard:6:in `<top (required)>'
> [#] /home/jitendra/.rvm/gems/ruby-2.1.1@global/bin/guard:23:in `load'
> [#] /home/jitendra/.rvm/gems/ruby-2.1.1@global/bin/guard:23:in `<main>'
> [#] /home/jitendra/.rvm/gems/ruby-2.1.1@global/bin/ruby_executable_hooks:15:in `eval'
> [#] /home/jitendra/.rvm/gems/ruby-2.1.1@global/bin/ruby_executable_hooks:15:in `<main>'
22:58:04 - ERROR - Invalid Guardfile, original error is:
> [#] undefined method `superclass' for nil:NilClass
/home/jitendra/.rvm/gems/ruby-2.1.1@global/gems/guard-2.6.1/lib/guard/plugin_util.rb:57:in `initialize_plugin': undefined method `superclass' for nil:NilClass (NoMethodError)
    from /home/jitendra/.rvm/gems/ruby-2.1.1@global/gems/guard-2.6.1/lib/guard.rb:167:in `add_plugin'
    from /home/jitendra/.rvm/gems/ruby-2.1.1@global/gems/guard-2.6.1/lib/guard/dsl.rb:174:in `block in guard'
    from /home/jitendra/.rvm/gems/ruby-2.1.1@global/gems/guard-2.6.1/lib/guard/dsl.rb:173:in `each'
    from /home/jitendra/.rvm/gems/ruby-2.1.1@global/gems/guard-2.6.1/lib/guard/dsl.rb:173:in `guard'
    from /home/jitendra/milaap-webapp/Guardfile:4:in `_instance_eval_guardfile'
    from /home/jitendra/.rvm/gems/ruby-2.1.1@global/gems/guard-2.6.1/lib/guard/guardfile/evaluator.rb:97:in `instance_eval'
    from /home/jitendra/.rvm/gems/ruby-2.1.1@global/gems/guard-2.6.1/lib/guard/guardfile/evaluator.rb:97:in `_instance_eval_guardfile'
    from /home/jitendra/.rvm/gems/ruby-2.1.1@global/gems/guard-2.6.1/lib/guard/guardfile/evaluator.rb:37:in `evaluate_guardfile'
    from /home/jitendra/.rvm/gems/ruby-2.1.1@global/gems/guard-2.6.1/lib/guard/setuper.rb:148:in `evaluate_guardfile'
    from /home/jitendra/.rvm/gems/ruby-2.1.1@global/gems/guard-2.6.1/lib/guard/setuper.rb:64:in `setup'
    from /home/jitendra/.rvm/gems/ruby-2.1.1@global/gems/guard-2.6.1/lib/guard/commander.rb:24:in `start'
    from /home/jitendra/.rvm/gems/ruby-2.1.1@global/gems/guard-2.6.1/lib/guard/cli.rb:107:in `start'
    from /home/jitendra/.rvm/gems/ruby-2.1.1@global/gems/thor-0.19.1/lib/thor/command.rb:27:in `run'
    from /home/jitendra/.rvm/gems/ruby-2.1.1@global/gems/thor-0.19.1/lib/thor/invocation.rb:126:in `invoke_command'
    from /home/jitendra/.rvm/gems/ruby-2.1.1@global/gems/thor-0.19.1/lib/thor.rb:359:in `dispatch'
    from /home/jitendra/.rvm/gems/ruby-2.1.1@global/gems/thor-0.19.1/lib/thor/base.rb:440:in `start'
    from /home/jitendra/.rvm/gems/ruby-2.1.1@global/gems/guard-2.6.1/bin/guard:6:in `<top (required)>'
    from /home/jitendra/.rvm/gems/ruby-2.1.1@global/bin/guard:23:in `load'
    from /home/jitendra/.rvm/gems/ruby-2.1.1@global/bin/guard:23:in `<main>'
    from /home/jitendra/.rvm/gems/ruby-2.1.1@global/bin/ruby_executable_hooks:15:in `eval'
    from /home/jitendra/.rvm/gems/ruby-2.1.1@global/bin/ruby_executable_hooks:15:in `<main>'

Answer 1

This is how i work with livereload:

1.) Get the gem

In your Gemfile:

group :development do
  gem 'guard-livereload', require: false
end

2.) guard init livereload , Which will generate a Guardfile at the root of your App.

3.) Opening your Guardfile it should look like this (Just the Guard-Livereload, if you run other guard plugins make sure they're below the livereload.)

guard 'livereload' do
  watch(%r{app/views/.+\.(erb)$})
  watch(%r{app/helpers/.+\.rb})
  watch(%r{public/.+\.(css|js|html)})
  watch(%r{config/locales/.+\.yml})
  watch(%r{(app|vendor)(/assets/\w+/(.+\.(css|js|html|png|jpg))).*}) { |m| "/assets/#{m[3]}" }
end

4.) Get the Livereload Chrome App from the Chrome Web Store

5.) Restart your server and open a separate tab and type-> guard

6.) In your Browser push the livereload button and it should link it (Browser Connected in the Guard Tab)

I wrote it extensively for other's which may stumble upon the same question. For your specific case read #3 . Open your guardfile and make sure livereload is called first.

Go watch the Railscast #264 Guard

When working with SSL, livereload doesn't like that quite well.

Rack-Livereload is a neat little gem which you can add to your project to get around the SSL problems. The gem inserts a piece or Rack middleware and basically connects to the livereload app to serve up the javascript through the existing (and SSL enabled) Rails server.

Answer 2

Please check https://github.com/railsjazz/rails_live_reload which could be used in Rails app.

With it you can reload only rendered pages if you making edits in them, or when you are changing locale files, or CSS, etc.