grunt-css-amd

Parses css files into javascript AMD modules files.

npm install grunt-css-amd
1 downloads in the last week
13 downloads in the last month

grunt-css-amd

Compile css files into javascript AMD named module files. Submitted by Thiago Felix.

Getting Started

Install this grunt plugin next to your project's grunt.js gruntfile with: npm install grunt-grunt-css-amd

Then add this line to your project's grunt.js gruntfile:

grunt.loadNpmTasks('grunt-css-amd');

Overview

Inside your grunt.js file, add a section named cssamd.

This task will find all matched css files and compile each file to a relative javascript ( AMD module formatted ) file

This idea came up from the soundclound team on this post.

The main reason to do that is because compiling css to amd module you can require it as a view dependencie on Backbone like soundcloud team demonstrate on their blog.

There is a Demo about this concept, see it in action.

Config Example

cssamd: {
  compile:{
    files: {      
      "path/to/modules/folder/": [
        "path/to/css/folder/**/*.css"
      ]
    }
    options: {
        moduleNamePrefix: "" // Optional
    }
  }
}

Parameters

files

This define where the modules will be saved after processing css files

Options

moduleNamePrefix (optional)

By default the name of module will be "path/to/modules/folder" + "css_file_name.css". Like this exemple below: define("path/to/moodules/folder/foo.css", [], function(){})

If you set a moduleNamePrefix, it will override the "path/to/module/folder/" in the module's name.

npm loves you