sass-monitor

sass-monitor is a wrapper for the node_sass module adding the functionality to compile named directories of SASS files.

sass-monitor is a wrapper for the node_sass module adding the functionality to compile named directories of SASS files.

It can be run standalone or as a Grunt task.

Be sure to run $ npm install before use.

  1. In the root of the package run:

    $ node sass-monitor

  2. Edit the ./test/css_src/test.scss file

  3. You should now see:

    a) A log entry in the terminal: 'File changed : test/css_src/test.scss' b) The ./test/css_output/test.css file with your compiled changes.

  1. Edit config.js to suit path requirements.

  2. At the command prompt run:

    $ node sassMonitor

NOTE: As above the imports will be relative ..

module.exports = function(grunt) {

// Project configuration.
grunt.initConfig({
    sassMonitor: {
        staticBuild: {
            srcDir: 'css_src',
            destDir: '../developmentPath/static/css',
            includePaths: ['environments/static/','css_src/'],
            debug: true
        },
        production: {
            srcDir: 'css_src',
            destDir: '../productionPath/static/css',
            includePaths: ['environments/prod/','css_src/'],
            debug: true
        },
    },
    watch: {
        css: {
            files: '../css_src/**/*.scss',
            tasks: 'sassMonitor'
        }
    }
});

grunt.loadNpmTasks('sass-monitor');

// Default task.
grunt.registerTask('default', 'watch');

};

NOTE: Partial imports are relative to the grunt installation folder so for the above example it would be @import '../css_src/common';