bem-site / bem-forum-content-ru

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

Проблемы со сборкой BEMHTML и HTML после обновления enb-bem-techs #569

Closed Hurtsok closed 8 years ago

Hurtsok commented 9 years ago

Привет! Обновил enb-bem-techs@1.0.4 до версии 2.0.0 и начались проблемы со сборкой bemhml и html. Сама сборка проходит без ошибок, но по окончании сборки я имею пустой html файл и странно собранный bemhtml. Все шаблоны в нем продублированы по 2 раза. Циклические зависимости mustDeps отсутствуют в deps файлах, т.к я использую ключ strict: true

Почему html файл пустой и почему шаблоны продублированы 2 раза?

Пример сборки бандлов:

    config.nodes(bemPages, function(nodeConfig) {
        var path = nodeConfig.getPath();
        nodeConfig.addTechs([
            [ require('enb-bem-techs/techs/levels'), { levels: getLevels(config, path) } ],
            [ techs.fileProvider, { target: '?.bemjson.js' } ],
            [ enbBemTechs.bemjsonToBemdecl ],
            [ enbBemTechs.depsOld, { strict: true } ],
            [ enbBemTechs.files ],
            //CSS
            [ techs.stylus, { target: '?.css', autoprefixer: { browsers: [ "> 2%", "last 2 versions", "Firefox ESR", "Opera 12.1", "Android >= 4", "iOS >= 5" ] } } ],
            //BEMHTML
            [ techs.bemhtml, { sourceSuffixes: [ 'bemhtml', 'bemhtml.js' ] } ],
            //HTML
            [ techs.htmlFromJSON ],
            [ techs.htmlBeautify ],
            //client JS
            [ techs.browserJs ],
            [ techs.fileMerge, { target: '?.pre.js', sources: [ '?.bemhtml.js', '?.browser.js' ] } ],
            [ techs.prependYm, { source: '?.pre.js' }]
        ]);

        nodeConfig.mode('production', function(nodeConfig){
            //CSS
            nodeConfig.addTechs([
                [ techs.stylus, { target: '_?.css', autoprefixer: { browsers: [ "> 2%", "last 2 versions", "Firefox ESR", "Opera 12.1", "Android >= 4", "iOS >= 5" ] }, compress: true } ]
            ]);
            nodeConfig.addTechs([
                //BORSCHIK
                [ techs.borschik,  { sourceTarget: '?.js', destTarget: '_?.js', freeze: true, minify: true} ]
            ]);
            nodeConfig.addTargets([ '_?.css', '_?.js' ]);
        })

        nodeConfig.addTargets([ '?.js', '?.css', '?.html', '?.browser.js', '?.beauty.html' ]);
    });
blond commented 9 years ago

Привет!

Пробовал ли собирать без учёта кэша enb make -n?

Hurtsok commented 9 years ago

@blond Да. Сначала запускал enb make clean затем enb make -n. Ошибок нет, но сборка кривая

blond commented 9 years ago

Не похоже на проблемы enb-bem-techs. Работа этого пакета заканчивается на построении ?.files. Если BEMHTML собирается, значит ?.files построился.

А какая версия enb-bemxjst используется?

Заметил, что BEMHTML собирается по нескольким суффиксам:

 [ techs.bemhtml, { sourceSuffixes: [ 'bemhtml', 'bemhtml.js' ] } ],

На файловой системе есть блоки у которых реализация и в bemhtml и в bemhtml.js? Из-за этого шаблоны могли продублироваться два раза.

Hurtsok commented 9 years ago

А какая версия enb-bemxjst используется

enb-bemxjst@1.3.5. До 2 версии еще не обновлял так как жду релиза в npm.

Заметил, что BEMHTML собирается по нескольким суффиксам: [ techs.bemhtml, { sourceSuffixes: [ 'bemhtml', 'bemhtml.js' ] } ], На файловой системе есть блоки у которых реализация и в bemhtml и в bemhtml.js? Из-за этого шаблоны могли продублироваться два раза.

Да, такие блоки есть и они в bem-core. Я использую реализацию блока page. Версия bem-core@2.5.1 И такой проблемы не было как сейчас до перехода на 2 версию enb-bem-techs

Hurtsok commented 9 years ago

@blond Блоки которые имеют только реализацию в bemhtml.js все равно дублируются

blond commented 9 years ago

Есть ли возможность выложить пример, на котором можно воспроизвести проблему?

Hurtsok commented 9 years ago

@blond Сейчас попробую.

Hurtsok commented 9 years ago

@blond Собрал на скорую руку :) https://github.com/Hurtsok/enbBemTechProblem

blond commented 9 years ago

@Hurtsok Спасибо! Сегодня посмотрю.

blond commented 9 years ago

Нашёл проблему. Она в этой строчке: https://github.com/Hurtsok/enbBemTechProblem/blob/master/.bem/enb-make.js#L88.

Если mobile равна false, то в массив добавится путь корню проекта. И получится что уровни просканируются 2 раза, и в bemhtml код попадёт тоже два раза.

Почему раньше работало, пока не понял. Почему файлы не отфильтровались технологией files пока тоже, возможно это баг.

blond commented 9 years ago

Да, это ошибка — https://github.com/enb-bem/enb-bem-techs/issues/179.

blond commented 9 years ago

PR с исправлением — https://github.com/enb-bem/enb-bem-techs/pull/180

Hurtsok commented 9 years ago

@blond Спасибо!

Hurtsok commented 9 years ago

@blond Обновился, все хорошо собралось, повторяющихся блоков в bemhtml.js нет. Но возник вопрос по уровням переопределения. Раньше в bemhtml.js шаблоны шли в таком порядке.

bem-core\common.blocks\page\page.bemhtml
bem-core\common.blocks\page\__css\page__css.bemhtml
bem-core\common.blocks\page\__js\page__js.bemhtml

desktop.blocks\page\page.bemhtml.js

Т.е мой блок page переопределял тот что в bem-core Сейчас я получаю такую сборку:

bem-core\common.blocks\page\page.bemhtml
desktop.blocks\page\page.bemhtml.js 
bem-core\common.blocks\page\__css\page__css.bemhtml
bem-core\common.blocks\page\__js\page__js.bemhtml

Т.е если я пишу представление элементов блока в общем файле, то я в такой ситуации не могу перекрыт те что расположены в bem-core в отдельных файлах. Не понимаю как быть?

tadatuta commented 9 years ago

@Hurtsok В идеале — разнести переопределение по отдельным файлам. Но если очень не хочется, можно написать в page.deps.js:

({
    mustDeps: { elem: ['css', 'js'] }
})
Hurtsok commented 9 years ago

@tadatuta Просто по логике уровни же должны же идти с верху в низ, а не в хаотическом порядке. Так было до обновления enb-bem-techs до 2 версии. Или я чего то не понимаю?

Hurtsok commented 9 years ago

@tadatuta В доке по миграции на 2 версию написано, что:

Файлы должны быть отсортированы сперва по уровню, и только потом по суффиксу.

tadatuta commented 9 years ago

@Hurtsok гарантируется порядок уровней в рамках каждой сущности:

level1/block1
level2/block1
level3/block1
level1/block2
level2/block2
apsavin commented 9 years ago

Кстати, у меня до перехода на enb файлы собирались так:

level-1/block/block.vanilla.js
level-1/block/block.browser.js
level-2/block/block.vanilla.js
level-2/block/block.browser.js

А теперь собираются вот так:

level-1/block/block.vanilla.js
level-2/block/block.vanilla.js
level-1/block/block.browser.js
level-2/block/block.browser.js

Если

Файлы должны быть отсортированы сперва по уровню, и только потом по суффиксу.

Получается, в enb баг?

blond commented 9 years ago

@apsavin всё так — https://github.com/enb-bem/enb-bem-techs/issues/156

Какую версию enb и enb-bem-techs используешь?

apsavin commented 9 years ago

"enb": "^0.15.0", "enb-bem-techs": "^1.0.3"

Понятно, обновлюсь.

tadatuta commented 9 years ago

@apsavin за последнее время случилась целая куча релизов сборочных пакетов, есть смысл посмотреть на project-stub

apsavin commented 9 years ago

@tadatuta Да, спасибо, я в принципе слежу за всем этим, но не всегда есть время все проекты обновлять до всего самого свежего.

qfox commented 9 years ago

Тулзу надо! ;-)

tadatuta commented 9 years ago

@zxqfox https://david-dm.org/ ;)

apsavin commented 9 years ago

@zxqfox ага, тулзу, которая бы читала release notes и правила код проектов при необходимости после обновления зависимостей.)

tadatuta commented 9 years ago

Влад @vkz по такому принципу конвертилку для BEMHTML делает: собирает ломающие отличия между версиями компилятора и из старых шаблонов генерит новые, уже учитывающие все требования новых версий компилятора.