I want to import html fragments at various places in a generated html file when I run it through a gulp task.
The following is my gulp task:
gulp.task('build_html', function () {
gulp.src('resources/index.html')
.pipe(template({ident: '1'}))
.pipe(gulp.dest('frontend'));
});
Inside the index.html file is a lot of html I would like to load from fragments, for example a bootstrap dropdown menu
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
which I would like to be able to load by having something like
<% load("dropdown"); %>
And then it looks for the dropdown file in a relative path...
Anyway I suppose it should be done using the mixin functionality http://lodash.com/docs#mixin but given that I am using gulp I need a file loader etc.
Anyone already done this or have an example they can point me to?