Build BEM project with gulp-bem

bemhtml.browser.js

// bem/.tmpls/bemhtml.browser.js
var BEMHTML;

(function(global) {
    function buildBemXjst(__bem_xjst_libs__) {
        var exports = {};

<%= contents %>


        return exports;
    };

    

    var defineAsGlobal = true;

    // Provide with CommonJS
    if (typeof module === 'object' && typeof module.exports === 'object') {
        exports['BEMHTML'] = buildBemXjst({
    
}
);
        defineAsGlobal = false;
    }

    // Provide to YModules
    if (typeof modules === 'object') {
        modules.define(
            'BEMHTML',
            [],
            function(
                provide
                
                ) {
                    provide(buildBemXjst({
    
}
));
                }
            );

        defineAsGlobal = false;
    }

    // Provide to global scope
    if (defineAsGlobal) {
        BEMHTML = buildBemXjst({
    
}
);
        global['BEMHTML'] = BEMHTML;
    }
})(typeof window !== "undefined" ? window : global || this);

bemtree.browser.js

// bem/.tmpls/bemtree.browser.js
var BEMTREE;

(function(global) {
    function buildBemXjst(__bem_xjst_libs__) {
        var exports = {};

<%= contents %>

        return exports;
    };

    

    var defineAsGlobal = true;

    // Provide with CommonJS
    if (typeof module === 'object' && typeof module.exports === 'object') {
        exports['BEMTREE'] = buildBemXjst({
    
}
);
        defineAsGlobal = false;
    }

    // Provide to YModules
    if (typeof modules === 'object') {
        modules.define(
            'BEMTREE',
            [],
            function(
                provide
                
                ) {
                    provide(buildBemXjst({
    
}
));
                }
            );

        defineAsGlobal = false;
    }

    // Provide to global scope
    if (defineAsGlobal) {
        BEMTREE = buildBemXjst({
    
}
);
        global['BEMTREE'] = BEMTREE;
    }
})(typeof window !== "undefined" ? window : global || this);

gulpfile.js

const Builder = require('gulp-bem-bundle-builder');
const bundler = require('gulp-bem-bundler-fs');
const gulp = require('gulp');
const path = require('path');
const postcss = require('gulp-postcss');
const postcssUrl = require('postcss-url');
const autoprefixer = require('autoprefixer');
const debug = require('gulp-debug');
const csso = require('gulp-csso');
const filter = require('through2-filter').obj;
const merge = require('merge2');
const concat = require('gulp-concat');
const stylus = require('gulp-stylus');
const uglify = require('gulp-uglify');
const bemhtml = require('gulp-bem-xjst').bemhtml;
const bemtree = require('gulp-bem-xjst').bemtree;
const toHtml = require('gulp-bem-xjst').toHtml;
const nodemon = require('gulp-nodemon');
const wrap = require('gulp-wrap');
const browserify = require('gulp-browserify');
const sourcemaps = require('gulp-sourcemaps');
const babel = require('gulp-babel');
const gulpif = require('gulp-if');
const include = require('gulp-include');

const env = process.env.NODE_ENV

const builder = Builder({
    levels: [
        'bem/libs/bem-core/common.blocks',
        'bem/libs/bem-core/desktop.blocks',
        'bem/libs/bem-components/common.blocks',
        'bem/libs/bem-components/desktop.blocks',
        'bem/libs/bem-components/design/common.blocks',
        'bem/libs/bem-components/design/desktop.blocks',
        'bem/libs/bem-forms/common.blocks',
        'bem/libs/bem-animations/@common',
        'bem/libs/bem-animations/@bem-core-v4',
        'bem/blocks/@common/',
        'bem/blocks/@desktop/',
    ],
    techMap: {
        bemtree: ['bemtree.js'],
        bemhtml: ['bemhtml.js'],
        js: ['js', 'vanilla.js', 'source.js', 'browser.js'],
        css: ['styl', 'css', 'post.css']
    }
});

gulp.task('build', () => {
    return bundler('bem/bundles/*')
        .pipe(builder({
            css: bundle =>
                bundle.src('css')
                    .pipe(sourcemaps.init())
                    .pipe(stylus())
                    .pipe(concat(bundle.name + '.min.css'))
                    .pipe(postcss([
                        require('postcss-import')(),
                        require('postcss-each'),
                        require('postcss-for'),
                        require('postcss-calc')(),
                        require('postcss-nested'),
                        require('pobem'),
                        require('postcss-media-minmax')(),
                        require('postcss-custom-media'),
                        require('postcss-css-variables')(),
                        require('lost')(),
                        require('postcss-svg')({
                          paths: ['bem/icons'],
                          defaults: "[fill-opacity]: 1",
                          svgo: true,
                          // debug: true
                        }),
                        autoprefixer({
                          browsers: ['ie >= 10', 'last 2 versions', 'opera 12.1', '> 2%']
                        })
                    ]))
                    .pipe(sourcemaps.write())
                    .pipe(concat(bundle.name + '.min.css')),
                    // .pipe(csso()),
            js: bundle =>
                merge(
                    gulp.src(require.resolve('ym')),
                    bundle.src('js')
                        .pipe(filter(f => ~['vanilla.js', 'browser.js', 'js'].indexOf(f.tech))),
                    bundle.src('js').pipe(filter(f => f.tech === 'source.js'))
                        .pipe(browserify())
                        .pipe(wrap({src: './bem/.tmpls/iife.js'})),
                    bundle.src('bemhtml')
                        .pipe(concat('browser.bemhtml.js'))
                        .pipe(bemhtml({elemJsInstances: true}))
                        .pipe(wrap({src: './bem/.tmpls/bemhtml.browser.js'})),
                    bundle.src('bemtree')
                        .pipe(concat('browser.bemtree.js'))
                        .pipe(bemtree())
                        .pipe(wrap({src: './bem/.tmpls/bemtree.browser.js'}))
                )
                    .pipe(include({
                        hardFail: true,
                        includePaths: [
                            __dirname + "/bem"
                        ]
                    }))
                    .pipe(gulpif(env === 'production', babel({ presets: ['es2015'], compact: false })))
                    .pipe(gulpif(env === 'production', uglify()))
                    .pipe(concat(bundle.name + '.min.js')),
            bemhtml: bundle =>
                bundle.src('bemhtml')
                    .pipe(concat('any.bemhtml.js'))
                    .pipe(bemhtml())
                    .pipe(concat(bundle.name + '.bemhtml.js'))
                    .pipe(gulp.dest('./bem/server/')),
            bemtree: bundle =>
                bundle.src('bemtree')
                    .pipe(concat('any.bemtree.js'))
                    .pipe(bemtree())
                    .pipe(concat(bundle.name + '.bemtree.js'))
                    .pipe(gulp.dest('./bem/server/')),
       }))
       .on('error', console.error)
       .pipe(debug())
       .pipe(gulp.dest('./public/bundles/'));
});

// gulp.watch(['bem/blocks/**', '!bem/blocks/**/*.source.js'], gulp.parallel('build'));
// // gulp.task('watch', done => {
//     // done();
// // });
// 
// 
// gulp.task('server', function () {
//   return nodemon({
//     script: 'server.js'
//     , ext: 'js'
//     , ignore: [
//       '.git',
//       'node_modules/**/node_modules',
//       'bem/bundles/*/*.min.js',
//       'bem/bundles/*/*.bemdecl.js',
//       'bem/bundles/*/*.deps.js',
//       'bem/bundles/*/*.browser*'
//     ]
//     , watch: ['app', 'bootstrap', 'config', '.env', './bem/server/*.js']
//   })
//   .on('restart', function () {
//     console.log('Server restarted!')
//   })
// })


gulp.task('default', gulp.series('build', 'server'));

iife.js

// bem/.tmpls/iife.js
(function(){
<%= contents %>
}());