bem-site / bem-forum-content-ru

Content BEM forum for Russian speak users
MIT License
56 stars 6 forks source link

Сборка .stylus и .post.css из bem-components #1299

Open philipusis opened 7 years ago

philipusis commented 7 years ago

Добрый вечер! Пытаюсь собрать в один файл стили своих компонентов и стили в *.post.css-файлах из bem-components. Как понимаю, для этого нужна технология enb-postcss, которую я беру отсюда: https://github.com/awinogradov/enb-postcss Я добавляют postcss в технологии:

let postCSS = require('enb-postcss/techs/enb-postcss');

module.exports = function(config) {
    config.node('bundles/index', function(nodeConfig) {
        nodeConfig.addTechs([
            ...
            [postCSS, {
                comments : true,
                sourcemap : true,
                plugins : [require('postcss')()],
                oneOfSourceSuffixes : [['post.css', 'css'], ['ie.post.css', 'ie.css']],
                target: '?.post.css'
            }]
        ]);
        nodeConfig.addTargets(['?.post.css']);
    });
};

В index.post.css получаю набор импортов в соответствии с построенным .deps.js файлом:

/* ../../libs/bem-components/common.blocks/button/button.post.css:begin */
@import "../../libs/bem-components/common.blocks/button/button.post.css";
/* ../../libs/bem-components/common.blocks/button/button.post.css:end */

/* ../../libs/bem-components/common.blocks/input/input.post.css:begin */
@import "../../libs/bem-components/common.blocks/input/input.post.css";
/* ../../libs/bem-components/common.blocks/input/input.post.css:end */

И теперь мне непонятно, куда и как мне передавать и этот файл, и stylus-файлы моих блоков, чтобы на выходе получить css-ку?

DjonyBastone commented 7 years ago

смотри в сторону технологий techMap и сборки стилей css: bundle. Пример моего gulpfile.js

Не знаю как в enb, перед продакшн буду разбираться. Для разработки пока gulp хватает

tadatuta commented 7 years ago

@philipusis на самом деле bem-components поставляются в комплекте с уже скомпилированными css-файлами. Так что подключать себе PostCSS, если используется Stylus нет необходимости.

philipusis commented 7 years ago

Спасибо! Возьму готовые из cdn'ки

tadatuta commented 7 years ago

Не обязательно из cdn-ки, пакеты в bower и npm тоже содержат скомпилированные версии рядом с версией для PostCSS.