Так уж получилось, что я разрабатываю сайты на Битриксе. В прошлом году сделали свой модуль, который позволяет нам подключать блоки из local/blocks в рантайм страницы. Ранее писал, что сборку проводим через gulp. Сейчас хотим пойти дальше: перенести сборку файлов технологий css, js на bem make и добавить собрку бандлов для страниц local/bundles.
С блоками я разобрался, с бандлами тоже, добавил технологию scss (по аналогии с sass). Что осталось?
- Изменить технологию scss, чтобы она заработала через gulp-compass – думаю, тут осилю я сам, нужно только время
- Настроить сборку файлов технологий (css, js) в папке блока
- Настроить сборку бандлов, сейчас получаю ошибку http://take.ms/3blFQ (мой .bem/make.js – http://pastebin.com/kQHFt736)
- Отключить при сборке бандла минификацию html
PS: про enb в курсе, если можете помочь в формулировании нужного формата сборки в терминах enb – буду только рад)
Для примера сборки файлов блоков см. https://github.com/bem/project-stub/blob/borschik-js-freeze/.bem/make.js#L76-L92
Чтобы разобраться с ошибкой, возникающей при сборке бандлов, нужно еще взглянуть на level.js, где описывается путь до технологии bemhtml. Есть возможность запушить на github всю папку
.bem?см. https://ru.bem.info/forum/332/
@tadatuta весь репозиторий с нашим шаблоном в https://bitbucket.org/an1ma/aa.template/src
Если вопрос с минификацией html решается только через enb, то правильно ли я понимаю, что мне придется для сборки использовать enb make?
Если да, то вопрос про сборку файлов блоков следует отнести, наверное, к enb? А как там с технологиями из .bem и файлами level.js обстоят дела?
Минификации нет. А вопрос с получением на выходе отформатированного html решается пропусканием результата сборки через любой html beutifier.
Не-не, подойдет любой HTML-beautifier. Я когда-то делал технологию на основе
tidy, но там тянутся нативные зависимости, так что есть смысл перейти на чистое JS-решение, тот же js-beautify, например.ENB не умеет собирать файлы блоков. Как воркэраунд можно написать технологию, которая внутри будет вызывать тот же
gulp.Никак. ENB использует свои собственные конфиги.
Судя по всему, происходит следующее. В
make.jsдекларируется название технологии для сборки (например,bemhtml), но нигде не указывается путь к ее реализации.Для «ядерных» технологий будет работать без явного указания, т.к. технологии встроены в ядро
bem-tools(https://github.com/bem/bem-tools/tree/support/0.9.x/lib/techs), а для «кастомных» нужно явно указать, где их брать. В качестве примера см. https://github.com/bem/project-stub/blob/bem-core/.bem/levels/blocks.js (этот файл зовется из https://github.com/bem/project-stub/blob/bem-core/.bem/levels/bundles.js#L7, который в свою очередь подключается с помощью https://github.com/bem/project-stub/blob/bem-core/desktop.bundles/.bem/level.js).Вообще я бы рекомендовал зайти с другой стороны — взять
project-stub, где все уже настроено, и оторвать лишнее.@tadatuta я как раз с этого и начал, но видимо, много оторвал...
@mbakirov А вы какое-то одноразовое решение делаете? Кажется, что многим было бы интересно, и есть люди, которые могли бы поучаствовать в разработке.
@zxqfox нет, мы делаем не одноразовое решение. Вопросом скрещивания БЭМ и Битрикса занимаюсь уже давно, вот в прошлом году нашел, как мне кажется решение и написал свой модуль, который подключает блоки в рантайм CMS из папки local/blocks (выбирает .css и .min.js).
Почему я так взялся сейчас: я более-менее разобрался bem-tools и простыми технологиями. Появилась идея добавить подключение в рантайм битрикса бандлов из local/bundles. Например, на странице /index.php используется 100500 блоков, их проще увязать в bemjson (или deps.js) бандла и подключить сразу бандл local/bundles/index.
Собираем бэм-битриксовый стаб тут: https://bitbucket.org/an1ma/anima-stub/ Репозиторий паблик, ограничения только на ветку master, так что если есть желание присоединиться – очень буду рад))
Сейчас в ветке add-bem-make у меня опять ошибка path must be a string((
@mbakirov Вижу как минимум 2 проблемы:
browser.jsтребуетym. Подозреваю вы его не используете в принципе и нужно просто оторватьthis.getYmChunk(output)вlocal/.bem/techs/v2/vanilla.js.jsbem-core. Без него шаблоны работать не будут.@tadatuta Спасибо! Помогло! bem make прошел без ошибок, однако, ничего так и не собралось в index.html, index.js, index.sass.css (((( Куда еще копать можно?
@mbakirov Я отправил пулл-реквест https://bitbucket.org/an1ma/anima-stub/pull-request/1/fix-build/diff
@tadatuta Слил, сделал bem make, собрался html, собрался js, но не собрался css(((