Подключение плагина к PostCSS

Форум /

Расскажите пожалуйста, как подключить пакет для PostCSS на примере Lost (вариант, установить bem-grid не предлагать). Насколько мне известно, PostCSS уже включен в последний пакет enb-stylus.

Используется enb сборщик, и yo bem stub как стартовый пакет.

Хочу получить возможность использовать LostGrid в .styl, например:

.header {
    lost-column: 2; 
}

9 years ago

voischev

//cc @awinogradov

9 years ago

awinogradov

@vlastv https://github.com/awinogradov/enb-postcss

9 years ago

voischev

А чем bem-grid не подошел?

9 years ago

vlastv

@voischev я взял lost для примера, возможно мне нужны и другие плагины для postcss и хотелось понимать как их устанавливать.

9 years ago

Guria

В enb-stylus теперь тоже postcss подключен. Но, кажется, там нет API для подключения плагинов. сс @blond

9 years ago

blond

Да, в enb-stylus внутри используется PostCSS, но наружу не торчит никакой возможности подключить плагины, кроме как через поделку новых опций.

Считаете, что нужно подумать над таким API?

9 years ago

vlastv

Именно из-за того, что внутри используется PostCSS я и решил, что могу пользоваться плагинами. А оказалось, что не видно "снаружи", по этому и появился данный топик.

9 years ago

vlastv

@awinogradov ваш вариант имеет конфликт

Error: Concurrent techs for target: index.css, techs: "stylus" vs "enb-postcss"

// .enb/make.js
    config.nodes('*desktop.bundles/*', function (nodeConfig) {
        nodeConfig.addTechs([
            // essential
            [enbBemTechs.levels, {
                levels: [
                    { path: 'libs/bem-core/common.blocks', check: false },
                    { path: 'libs/bem-core/desktop.blocks', check: false },
                    { path: 'libs/bem-components/common.blocks', check: false },
                    { path: 'libs/bem-components/desktop.blocks', check: false },
                    'common.blocks',
                    'desktop.blocks'
                ]
            }],
            // css
            [require('enb-stylus/techs/stylus'), {
                target: '?.css',
                autoprefixer: {
                    browsers: ['ie >= 10', 'last 2 versions', 'opera 12.1', '> 2%']
                }
            }],
            // postcss
            [require('enb-postcss/techs/enb-postcss'), {
                sourcemap : true,
                plugins : [require('lost')()]
            }],
        ]);
    });

9 years ago

tadatuta

@vlastv и enb-stylus, и enb-postcss принимают на вход fileList, а в данном случае необходимо, чтобы результат работы enb-stylus (бандл) был обработан postCSS.

Вот пример того, что подойдет, пока не появится возможность подключать плагины прямо в enb-stylus: https://github.com/tadatuta/enb-bundle-postcss

9 years ago

vkhv

tadatuta а есть ли в enb-stylus возможность прокинуть не валидный код в бандл? Для дальнейшей обработки enb-bundle-postcss'ом?

Например такой код: @define-mixin icon $name { padding-left: 16px; &::after { content: ""; background-url: url(/icons/$(name).png); } }

.search { @mixin icon search; }

Сломает сборку, а нужно чтобы он пробросился в бандл и обработался postCSS'ом.

9 years ago

tadatuta

@campykid Нет. Можно поставить postCSS перед Stylus либо писать код, предназначенный только для postCSS, в файлах с расширением css, они (вроде) будут переданы дальше без измеений.

Но @ai обещает в обозримом будущем sugarSS, тогда в Stylus в принципе нужда отпадет.

Чтобы оставлять комментарии, необходимо авторизоваться.