Practical SASS environments with RVM

One of our favourite things about working with SASS here at Razor Jam is its extensibility.

Addons like Compass and Susy help to bring even more firepower to our frontend arsenal, and the rich community around SASS means there’s always new things to try.

Recently however we ran into a few problems with a cascade of dependencies between different versions of our favourite SASS extensions. The outcome was that in order to be able to maintain an older project we had to keep our SASS version at 3.2, unable to flex with things like SASS Maps and parent selector prefixes on our newer work. Rubbish right?!

Fortunately, there is a tool called Ruby Version Manager (RVM) that makes rapidly switching between Gem versions a breeze, meaning you can maintain any number of setups be they legacy, stable or bleeding edge.

Step 1: Install RVM

If you’re not already using RVM then installation is easy. Simply paste the following command into a terminal window:

\curl -sSL https://get.rvm.io | bash -s stable

Once RVM is installed you will need to load RVM like so:

source ~/.rvm/scripts/rvm

(RVM should also automatically add a line into your .bash_profile to ensure it is loaded in each future shell instance)

Now to check everything worked correctly type rvm -v and you should get some version information back from RVM.

Step 2: Install Ruby

Now to let RVM take the reins of your Ruby setup we need to install Ruby through it. To do this run:

rvm install 2.1

At this stage RVM will need to use a package manager. If you already have Homebrew or MacPorts it should pick up on that, otherwise RVM will go and install Homebrew for you and then continue to install Ruby.

Once you’re done run which ruby and make sure you get something like this back:

/Users/yourname/.rvm/rubies/ruby-2.1.2/bin/ruby

This tells us that the system is now running Ruby from within ~/.rvm rather than from the default /usr/bin/ruby.

Tip: When doing work like this its convenient to be able to reload your .bash_profile quickly. To speed this add an alias to your .bash_profile itself with the line alias rbp='. ~/.bash_profile' and then you only need to run rbp when you want to reload your profile.

Step 3: Create some Gem Sets

You can probably tell from just installing Ruby with RVM how easy it makes changing versions of Ruby. For most front-end work and simply running SASS and a few other gems you’re unlikely to need to do this very often. The feature of RVM we will be using is called Named Gem Sets.

To create two new named gem sets type:

rvm gemset create current legacy

Here I’ve called the gem sets current and legacy, but you can use whatever names you like.

Now to use one of your gem sets:

rvm 2.1.2@current

(If you want to see your current environment at any time run rvm current)

With your new gem set active you can now install your current versions of SASS and related gems:

    gem install sass

    gem install compass --pre

    gem install susy

You can then continue installing any other gems into your current environment you might need.

Step 4: Change it up

Once you’ve got one gemset setup, switch to your legacy gemset:

rvm 2.1.2@legacy

Because this is a new gemset we no longer have access to any of the gems in our current environment. Let’s go ahead and install an older set of gems:

    gem install sass -v 3.2.19

    gem install compass

    gem install susy -v 1.0.9
    

Step 5: Go forth, innovate and maintain!

Now you know you can easily switch between gemsets you can easily maintain those older projects and quickly change versions of any number of gems in just a few keystrokes.