Skip to content

Grunt task that combines component's js and css resources in dependency order. (not requirejs)

License

Notifications You must be signed in to change notification settings

pennyfx/grunt-smush-components

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

26 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

grunt-smush-components

Grunt multi-task for concatinating components assets into single files. This task relies on the 'main' key in your bower.json to figure out which files are relevant. With the fileMap option, you can then create a map between a files extension and the destination output file. This project does not use requirejs or AMD It simply concatinates your files together.

Getting Started

If you haven't used grunt before, be sure to check out the Getting Started guide.

From the same directory as your project's Gruntfile and package.json, install this plugin with the following command:

npm install grunt-smush-components --save-dev

Once that's done, add this line to your project's Gruntfile:

grunt.loadNpmTasks('grunt-smush-components');

If the plugin has been installed correctly, running grunt --help at the command line should list the newly-installed plugin's task or tasks. In addition, the plugin should be listed in package.json as a devDependencies, which ensures that it will be installed whenever the npm install command is run.

The "smush-components" task

Overview

In your project's Gruntfile, add a section named smush-components to the data object passed into grunt.initConfig().

grunt.initConfig({
  'smush-components': {
    dist: {
      fileMap: {
        js: './public/js/components.js',
        css: './public/css/components.css'
      }
    }
  },
})

Options

fileMap

Type: Object Default value: { js: 'components.js', css: 'components.css' }

Map all files of a specific extension to a destination file

Usage Examples

Lazy Example

This will output to ./components.css and ./components.js

grunt.initConfig({
  'smush-components': {}
})

Custom Options

Outputs files according to the fileMap

grunt.initConfig({
  'smush-components': {
    fileMap: {
      js: './public/js/components.js',
      css: './public/css/components.js'

    }
  }
})

Contributing

In lieu of a formal styleguide, take care to maintain the existing coding style. Add unit tests for any new or changed functionality. Lint and test your code using grunt.

Release History

1.0.1 - Added packages key that allows package you to pick the packages you want

1.0.0 - Added multi-task support

About

Grunt task that combines component's js and css resources in dependency order. (not requirejs)

Resources

License

Stars

Watchers

Forks

Packages

No packages published