Package Exports

grunt-atomizer

This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (grunt-atomizer) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.

Readme

grunt-atomizer

Overview

A grunt task for running Atomizer

Install

npm install grunt-atomizer --save-dev

Usage

Options

options.config

The Atomizer config passed directly to the grunt task. See examples below. If options.configFile has not been passed, this options is required. A config must have namespace, start and end keys.

options.configFile

The Atomizer config file to generate atomic css. If options.config has not been passed, this options is required. A config must have namespace, start and end keys.

options.configOutput

The generated config file used by the tool. Useful for when parsing is used (See files.src below).

files.src

Any files matched by files.src will be parsed and if a valid atomic class is found, a config rule will be automatically used for this class. Some custom classes cannot be automatically generated by Atomizer based on the suffix. If these classes are found, you will get a warning to manually add them to the config.

files.dest

The path to the CSS file that will be created.

Examples

// Configuration to be run (and then tested).
atomizer: {
    // Passing a configFile
    configFileOnly: {
        options: {
            configFile: 'test/fixtures/sample-config.js'
        },
        files: [
            {
                dest: 'tmp/configFileOnly.css'
            }
        ]
    },
    // Passing the config to the grunt task directly
    configGruntOnly: {
        options: {
            config: {
                config: {
                    namespace: '#atomic',
                    start: 'left',
                    end: 'right'
                },
                display: {
                    ib: true
                }
            }
        },
        files: [
            {
                dest: 'tmp/configGruntOnly.css'
            }
        ]
    },
    // Using both config and configFile.
    // `options.config` has more precedence than configFile.
    configBoth: {
        options: {
            configFile: 'test/fixtures/sample-config.js',
            config: {
                config: {
                    namespace: '#atomic',
                    start: 'left',
                    end: 'right'
                },
                'border-top': {
                    custom: [
                        {suffix: '1', values: ['10px solid #ccc']}
                    ]
                },
                display: {
                    ib: true
                }
            }
        },
        files: [
            {
                dest: 'tmp/configBoth.css'
            }
        ]
    },
    // Using config, configFile and also parsing HTML files (it can be any type of file)
    // Parsing will warn if you've used a class that cannot be automatically generated and therefore requires you to manually add it to the config.
    configBothWithParsing: {
        options: {
            configFile: 'test/fixtures/sample-config.js',
            config: {
                config: {
                    namespace: '#atomic',
                    start: 'left',
                    end: 'right'
                },
                display: {
                    b: true
                }
            }
        },
        files: [
            {
                src: ['test/fixtures/*.html'],
                dest: 'tmp/configBothWithParsing.css'
            }
        ]
    }
}

License

This software is free to use under the Yahoo! Inc. BSD license. See the LICENSE file for license text and copyright information.

Third-pary open source code used are listed in our package.json file.