How to include handlebars in gulp?

Q

quiplunar2020-09-10 01:05:08

Handlebars

quiplunar, 2020-09-10 01:05:08

Here is my gulp config:

const gulp = require('gulp')
const {src, dest} = require('gulp')
const flatten = require('gulp-flatten')
const handlebars = require('gulp-handlebars')
const browserSync = require('browser-sync').create()

function browser() {
  browserSync.init({
    server: {
      baseDir: './dist/'
    },
    port: 3000,
    notify: false
  })
}

function html() {
  return src('./src/pages/*/*.hbs')
    .pipe(handlebars())
    .pipe(flatten({includeParents: 0}))
    .pipe(dest('./dist'))
    .pipe(browserSync.stream())
}

const build = gulp.series(html)
const watch = gulp.parallel(build, browser)

exports.html = html
exports.build = build
exports.watch = watch
exports.default = watch

Into index.hbs
Outto index.js with obscure content

Handlebars.template({"compiler":[8,">= 4.3.0"],"main":function(container,depth0,helpers,partials,data) {
    var stack1, lookupProperty = container.lookupProperty || function(parent, propertyName) {
        if (Object.prototype.hasOwnProperty.call(parent, propertyName)) {
          return parent[propertyName];
        }
        return undefined
    };

  return "<!DOCTYPE html>\r\n<html lang=\"en\">\r\n<head>\r\n  <meta charset=\"UTF-8\">\r\n  <title>Title</title>\r\n</head>\r\n<body>\r\n\r\n"
    + ((stack1 = container.invokePartial(lookupProperty(partials,"header"),depth0,{"name":"header","data":data,"helpers":helpers,"partials":partials,"decorators":container.decorators})) != null ? stack1 : "")
    + "\r\n</body>\r\n</html>\r\n";
},"usePartial":true,"useData":true})

How to get from hbs => html?

Reply

Answer the question

In order to leave comments, you need to log in

0 answer(s)