bem / project-stub

deps
314 stars 199 forks source link

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

Open maksimenka opened 7 years ago

maksimenka commented 7 years ago

Гуглил, в целом решения не нашел, кроме как использовать 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 7 years ago

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

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

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

ilyar commented 7 years ago

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

tadatuta commented 7 years ago

@ilyar

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

Как я ни пытался прописать 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 7 years ago

@Maksimenka

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