Skip to content

lackhurt/grunt-css-import

Folders and files

NameName
Last commit message
Last commit date

Latest commit

38b7ec7 · Jan 23, 2018

History

26 Commits
May 5, 2017
May 5, 2017
May 26, 2016
Jun 21, 2014
May 26, 2016
May 5, 2017
Jun 15, 2014
Jan 23, 2018
Aug 1, 2014
May 5, 2017
Aug 1, 2014

Repository files navigation

css-import

Concat the css file by @import. The relative url of the background image and font face will be changed automatically.

Getting Started

This plugin requires Grunt ~0.4.0

If you haven't used Grunt before, be sure to check out the Getting Started guide, as it explains how to create a Gruntfile as well as install and use Grunt plugins. Once you're familiar with that process, you may install this plugin with this command:

npm install grunt-css-import --save-dev

Once the plugin has been installed, it may be enabled inside your Gruntfile with this line of JavaScript:

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

The "grunt-css_import" task

Overview

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

grunt.initConfig({
    css_import: {
        your_target: {
            options: {

            },
            files: {
                'tmp/simple_concat/all.css': ['test/fixtures/style/all.css']
            }
        }
    }
}
});

Options

Default options is OK!

Usage Examples

In this example, the default options are used to do something with whatever. So if the all_modules.css file has the content

@import "module_a/a.css";
@import "module_b/b.css";
@import "../lib/lib.css";

ul {
   margin: 0;
}

And dest file is dest/all.css

grunt.initConfig({
  css_import: {
    files: {
      'dest/all.css': ['src/module/all_modules.css'],
    },
  },
});

Then dest/all.css

	/** module_a/a.css's content **/
	/** module_b/b.css's content **/
	/** ../lib/lib.css's content **/

	ul {
	   margin: 0;
	}

The relative url of the background image and font face will be changed automatically.