Skip to content

Latest commit

 

History

History
163 lines (107 loc) · 6.03 KB

api.ru.md

File metadata and controls

163 lines (107 loc) · 6.03 KB
Raw

API технологий

Пакет предоставляет следующие технологии:

  • css — технология собирает исходные CSS-файлы.
  • css-imports — технология состовляет список @import'ов из исходных CSS-файлов.

css

Собирает исходные CSS-файлы блоков со стилями.

Результатом сборки является CSS-файл. Для обработки итогового CSS используется CSS-построцессор postcss.

Опции

target

Тип: String. По умолчанию: ?.css.

Имя файла, куда будет записан результат сборки необходимых .css-файлов проекта.

filesTarget

Тип: String. По умолчанию: ?.files.

Имя таргета, откуда будет доступен список исходных файлов для сборки. Список файлов предоставляет технология files пакета enb-bem-techs.

sourceSuffixes

Тип: String | String[]. По умолчанию: ['css'].

Суффиксы, по которым отбираются файлы стилей для дальнейшей сборки.

sourcemap

Тип: String | Boolean. По умолчанию: false.

Построение карт кода (sourcemap) с информацией об исходных файлах.

Допустимые значения:

  • true: карта хранится в отдельном файле с расширение .map.
  • inline: карта встраивается в скомпилированный файл в виде закодированной строки в формате base64.

autoprefixer

Тип: Object | Boolean. По умолчанию: false.

Добавление вендорных префиксов с помощью autoprefixer.

Допустимые значения:

  • false: отключает autoprefixer.

  • true: префиксы добавляются для самых актуальных версий браузеров на основании данных сервиса caniuse.com (поведение по умолчанию модуля autoprefixer).

  • browsers: String[]: задание конфигурации в случае, если требуется передать точный список поддерживаемых браузеров.

    Пример

    {
    autoprefixer: { browsers: ['Explorer 10', 'Opera 12'] }
}

    Подробнее в документации autoprefixer.

compress

Тип: Boolean. По умолчанию: false.

Минификация CSS-кода. Используется csswring.

Поддерживает карты кода (sourcemap).

Пример использования технологии

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) {
        // Получаем имена файлов (FileList)
        node.addTechs([
            [FileProvideTech, { target: '?.bemdecl.js' }],
            [bemTechs.levels, { levels: ['blocks'] }],
            [bemTechs.deps],
            [bemTechs.files]
        ]);

        // Создаем CSS-файлы
        node.addTech([CSSTech, { /* опции */ }]);
        node.addTarget('?.css');
    });
};

css-imports

Состовляет список @import'ов из исходных CSS-файлов блоков.

Опции

target

Тип: String. По умолчанию: ?.css.

Имя файла, куда будет записан результат сборки необходимых .css-файлов проекта.

filesTarget

Тип: String. По умолчанию: ?.files.

Имя таргета, откуда будет доступен список исходных файлов для сборки. Список файлов предоставляет технология files пакета enb-bem-techs.

sourceSuffixes

Тип: String | String[]. По умолчанию: ['css'].

Суффиксы, по которым отбираются файлы стилей для дальнейшей сборки.

Пример использования технологии

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

module.exports = function(config) {
    config.node('bundle', function(node) {
        // Получаем имена файлов (FileList)
        node.addTechs([
            [FileProvideTech, { target: '?.bemdecl.js' }],
            [bemTechs.levels, { levels: ['blocks'] }],
            [bemTechs.deps],
            [bemTechs.files]
        ]);

        // Создаем CSS-файлы
        node.addTech([CSSImportsTech, { /* опции */ }]);
        node.addTarget('?.css');
    });
};