Read more

Automatically build sprites with Lemonade

Tobias Kraze
August 25, 2010Software engineer at makandra GmbH

How it works

See the lemonade descriptions Show archive.org snapshot .

Illustration web development

Do you need DevOps-experts?

Your development team has a full backlog? No time for infrastructure architecture? Our DevOps team is ready to support you!

  • We build reliable cloud solutions with Infrastructure as code
  • We are experts in security, Linux and databases
  • We support your dev team to perform
Read more Show archive.org snapshot

Unfortunately, the gem has a few problems:

  • it does not work with Sass2
  • it always generates all sprites when the sass file changes, which is too slow for big projects
  • it expects a folder structure quite different to our usual

All these problems are solved for us, in our own lemonade fork Show archive.org snapshot . This fork has since been merged to the original gem, maybe we can use that one now too.

Installation

  • gem install compass -v=0.10.2

  • gem install chunky_png -v=0.8.0

  • freeze our lemonade version

    • cd vendor/gems
    • git clone http://github.com/makandra/lemonade.git lemonade-0.3.4
    • rm -rf lemonade-0.3.4/.git
  • in config/environment.rb:

    • config.gem 'compass', :version => '=0.10.2'
    • config.gem 'lemonade', :version => '=0.3.4'
    • config.gem 'chunky_png', :version => '=0.8.0'
  • create config/initializers/compass.rb (or copy from development repo):
    ^
    require 'compass'
    rails_root = (defined?(Rails) ? Rails.root : RAILS_ROOT).to_s
    Compass.add_project_configuration(File.join(rails_root, "config", "compass.rb"))
    Compass.configure_sass_plugin!
    Compass.handle_configuration_change!

  • create config/compass.rb (or copy from development repo):
    ^

    This configuration file works with both the Compass command line tool and within Rails.

    Require any additional compass plugins here.

    project_type = :rails
    project_path = Compass::AppIntegration::Rails.root

    Set this to the root of your project when deployed:

    http_path = "/"`
    css_dir = "public/stylesheets"
    sass_dir = "public/stylesheets/sass"
    images_dir = "public/images"
    http_images_path = "../images"
    environment = Compass::AppIntegration::Rails.env

    To enable relative paths to assets via compass helper functions. Uncomment:

    relative_assets = true

    require 'lemonade'

  • in .gitignore:
    ^
    *.sprite_info.yml`
    also

Remarks

This setup is still not optimal:

  • dependency on compass is unnecessary
  • installation a bit involved (maybe we can use the usual gem?)
Tobias Kraze
August 25, 2010Software engineer at makandra GmbH
Posted by Tobias Kraze to makandra dev (2010-08-25 14:47)