Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How to setup Gruntfile to use compass/sass on heroku?

I've successfully set up my heroku app with the grunt buildpack. When I push my Node.js app to heroku it will run the appropriate grunt task.

What I'd like is to use the 'grunt-contrib-compass' package to compile my .scss files. But that requires the compass executable and I don't know how to get that.

I've checked the heroku documentation and have seen an outdated doc that describes setting up compass with ruby... but I haven't seen any recent documentation for setting it up with Node.js.

Any ideas?

like image 962
Jasper Avatar asked Apr 08 '13 22:04

Jasper


2 Answers

This took a lot of figuring out, but I've finally managed to get it to work. What's needed is to get Ruby to install alongside your Node.js app, so you can install the appropriate gems. This gist was very helpful and more-or-less describes what I needed to do.

In summary, the process was:

  • Create the files .buildpacks, Gemfile, and Gemfile.lock in the project directory, with the following contents:

.buildpacks

https://github.com/heroku/heroku-buildpack-ruby.git
https://github.com/heroku/heroku-buildpack-nodejs.git

Gemfile

source "http://rubygems.org"
gem "sass"

Gemfile.lock

GEM
  remote: http://rubygems.org/
  specs:
    sass (3.4.5)

PLATFORMS
  ruby

DEPENDENCIES
  sass

nb. I'm only using Sass, not Compass, but I'm guessing all you'll need to do to get compass is just add gem "compass" to the Gemfile and, eg. compass (1.0.3) below sass in the Gemfile.lock.

  • Add a multi buildpack to your app:

    heroku config:add BUILDPACK_URL=https://github.com/ddollar/heroku-buildpack-multi.git

  • Finally, push these out to Heroku, and Ruby and Sass should install alongside your Node.js app, allowing you to use sass-related grunt tasks.

like image 124
Nick F Avatar answered Nov 10 '22 21:11

Nick F


There is a forked-fork that includes compass installation. That might help:

https://github.com/stephanmelzer/heroku-buildpack-nodejs-grunt-compass

like image 31
Michael Schumacher Avatar answered Nov 10 '22 20:11

Michael Schumacher