Posted over 5 years ago. Visible to the public. Repeats.

Live CSS / view reloading

Next time you have to do more than trivial CSS changes on a project, you probably want to have live CSS reloading, so every time you safe your css, the browser updates automatically. It's pretty easy to set up and will safe you a lot of time in the long run. It will also instantly reload changes to your html views.

Simply follow the instructions below, taken from blog.55minutes.com.

Install CSS live reload (only once per project)

  1. Add this to your Gemfile in the :development group:

    Copy
    gem 'guard-livereload', :require => false gem 'rack-livereload'
  2. Run bundle install.
  3. Add the middleware, by adding the following to your config/environments/development.rb:

    Copy
    config.middleware.insert_after(ActionDispatch::Static, Rack::LiveReload)
  4. Run guard init livereload.
  5. Restart your server.

Use CSS live reload

Run guard -P livereload in a console, and keep it open. Now CSS changes should be instantly pushed to your browser.

Notes for Ruby 1.8.7 projects

I had some issues where newer versions of guard wouldn't see file changes in an Ruby 1.8.7 project. After some experiments the following versions of guard und guard-livereload worked for me:

Copy
gem 'guard', '=1.8.1' gem 'guard-livereload', '=1.4.0', :require => false

Notes for Rails 2.3 projects

On Rails 2.3, you need to add the middleware like this:

Copy
# config/environments/development.rb require 'rack-livereload' config.middleware.use ::Rack::LiveReload

Issues

When you run into Listen error: unable to monitor directories for changes you may fix it by increasing the amount of inotify watchers with

Copy
sudo sysctl fs.inotify.max_user_watches=100000 echo fs.inotify.max_user_watches=100000 | sudo tee -a /etc/sysctl.conf sudo sysctl -p

By refactoring problematic code and creating automated tests, makandra can vastly improve the maintainability of your Rails application.

Owner of this card:

Avatar
Tobias Kraze
Last edit:
over 2 years ago
by Henning Koch
Attachments:
livereload
About this deck:
We are makandra and do test-driven, agile Ruby on Rails software development.
License for source code
Posted by Tobias Kraze to makandra dev
This website uses cookies to improve usability and analyze traffic.
Accept or learn more