Install libsass with Grunt Sass and add Bourbon. Node-Sass is installed as a dependency of Grunt-Sass
$ npm install grunt-sass --save
$ npm install node-bourbon --save
{
"name": "class-demo",
}
Add some Bower packages
$ bower install color-scale --save
$ bower install type-rhythm-scale --save
$ bower install rwd-toolkit --save
npm install grunt --save
npm install grunt-contrib-watch --save-dev
Add gruntfile.js
module.exports = function(grunt) {
grunt.initConfig({
sass: {
dist: {
files: {
'public/stylesheets/application.css': 'sass/application.scss'
},
options: {
sourceMap: true,
includePaths: [
require('node-bourbon').includePaths,
'./bower_components/color-scale',
'./bower_components/type-rhythm-scale',
'./bower_components/rwd-toolkit'
]
}
}
},
watch: {
source: {
files: ['sass/**/*.scss', 'views/**/*.jade'],
tasks: ['sass'],
options: {
livereload: true, // needed to run LiveReload
}
}
}
});
grunt.loadNpmTasks('grunt-contrib-watch');
grunt.loadNpmTasks('grunt-sass');
grunt.registerTask('default', ['sass']);
};
Create the following directory and file, then add some sass to the file.
$ mkdir sass
$ touch sass/application.scss
Add these to the application.scss
manifest to make Sass aware of these dependencies.
@import "bourbon";
@import "type-rhythm-scale";
@import "rwd-toolkit";
$ grunt
$ grunt watch