bem/project-stub

Require в bemjson с помощью borschik

maksimenka opened this issue · 5 comments

maksimenka commented

Гуглил, в целом решения не нашел, кроме как использовать bemtree. Возможно ли проинклюдить в bemjson другой bemjson с учетом того чтобы при сборке так же собирались зависимости инклюд файлов?

Имеется index.bemjson.js в который я хочу во время сборки подтянуть header.bemjson.js в итогде я получил резуальтат инклюда без обработки.

module.exports ={
    "block" : "test2",
    "content" : "borschik:include:../parts/header/header.bemjson.js"
}

header.bemjson.js

{
    "block" : "header",
    "content": [{ "elem" : "logo" }]
}

Фрагмент gulpfile.js

html: bundle => {
                const bemhtmlApply = () => toHtml(bundle.target('tmpls'));
                return gulp.src(bundle.dirname + '/*.bemjson.js')
                    .pipe(borschik())
                    .pipe(bemhtmlApply())
            }

Получившийся index.html

<div class="test2">[{
    block: 'header',
    content: [{ elem: 'logo'}]
 #}]</div>
tadatuta commented

borschik:include работает по-разному в зависимости от способа его использования.

При вставке в виде строки к контенту применяется JSON.stringify. Подробнее про это см. https://github.com/borschik/borschik/blob/master/docs/js-include/js-include.en.md

Но я бы в данном случае предложил более простой вариант с использованием обычного require вместо borschik:include, только нужно помнить, что в рамках одного процесса рекваиры кэшируются.

  • 👍1
ilyar commented

@tadatuta borschik:include работает в bemhtml, может он заинлайнить svg?

tadatuta commented

@ilyar

  1. borschik работает в любом текстовом файле, если для него написать технологию.
  2. BEMHTML — это просто JS, поэтому технология доступна из коробки.
  3. Остается прогонять бандлы шаблонов через borschik на уровне сборки до того, как они будут использованы для шаблонизации.
  4. Для инлайнинга SVG в BEMHTML, возможно, удобнее использовать borschik.link, чем borschik:include.
maksimenka commented

Как я ни пытался прописать require, всегда одна и также ошибка:
Error: Cannot find module '../header/header.bemjson.js'

Структура бандла стандартная:
bundle
| - header
| - index

index.bemjson.js

module.exports =([{
    "block" : "test2",
    "content" : require('../header/header.bemjson.js')
}]);

header.bemjson.js

module.exports =([{
    block: 'header',
    content: "123"
}]);
tadatuta commented

@maksimenka

Похоже, что это сразу два бага:
gulp-bem/gulp-bem-bundler-fs#10
gulp-bem/gulp-bem-xjst#89

  • 👍1