EN
Forum

Methodology

Toolbox

Platform

Technologies API

The package includes the following technologies:

css

Collects the CSS source files for the blocks with styles.

The result of the build is a CSS file. The postcss post processor is used for processing the resulting CSS.

Options

target

Type: String. Default: ?.css.

The name of the file for saving the build result with the necessary .css project files.

filesTarget

Type: String. Default: ?.files.

The name of the target for accessing the list of source files for the build. The list of files is provided by the files technology in the enb-bem-techs package.

sourceSuffixes

Type: String | String[]. Default: ['css'].

The suffixes to use for filtering style files for the build.

sourcemap

Type: String | Boolean. Default: false.

The source map with information about the source files.

Acceptable values:

autoprefixer

Type: Object | Boolean. Default: false.

Adds vendor prefixes using autoprefixer.

Acceptable values:

compress

Type: Boolean. Default: false.

CSS minification Uses csswring.

Support source maps.

Example

var CSSTech = require('enb-css/techs/css'),
    FileProvideTech = require('enb/techs/file-provider'),
    bemTechs = require('enb-bem-techs');

module.exports = function(config) {
    config.node('bundle', function(node) {
        // Getting file names (FileList)
        node.addTechs([
            [FileProvideTech, { target: '?.bemdecl.js' }],
            [bemTechs.levels, { levels: ['blocks'] }],
            [bemTechs.deps],
            [bemTechs.files]
        ]);

        // Creating CSS files
        node.addTech([CSSTech, { /* options */ }]);
        node.addTarget('?.css');
    });
};

css-imports

Forms a list of @imports from the CSS source files for blocks.

Options

target

Type: String. Default: ?.css.

The name of the file for saving the build result with the necessary .css project files.

filesTarget

Type: String. Default: ?.files.

The name of the target for accessing the list of source files for the build. The list of files is provided by the files technology in the enb-bem-techs package.

sourceSuffixes

Type: String | String[]. Default: ['css'].

The suffixes to use for filtering style files for the build.

Example

var CSSImportsTech = require('enb-css/techs/css-imports'),
    FileProvideTech = require('enb/techs/file-provider'),
    bemTechs = require('enb-bem-techs');

module.exports = function(config) {
    config.node('bundle', function(node) {
        // Getting the file names (FileList)
        node.addTechs([
            [FileProvideTech, { target: '?.bemdecl.js' }],
            [bemTechs.levels, { levels: ['blocks'] }],
            [bemTechs.deps],
            [bemTechs.files]
        ]);

        // Creating CSS files
        node.addTech([CSSImportsTech, { /* options */ }]);
        node.addTarget('?.css');
    });
};
Rate the article
Report an error on GitHub or correct using prose.io.