Extend your html files
Clone or download
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Permalink
Type Name Latest commit message Commit time
Failed to load latest commit information.
test
.gitignore
.jshintrc
.travis.yml
README.md
index.js
package.json

README.md

gulp-html-extend NPM version Build Status Dependency Status

Make it easy to extend, include and replace your html files

master.html

<body>
    <!-- @@placeholder= content -->
    <!-- @@placeholder =footer -->
</body>

content.html

<!-- @@master  = master.html-->

<!-- @@block  =  content-->
<main>
    my content
</main>
<!-- @@close-->

<!-- @@block  =  footer-->
<footer>
    my footer
</footer>
<!-- @@close-->

output

<body>

<!-- start content -->
<main>
    my content
</main>
<!-- end content -->

<!-- start footer -->
<footer>
    my footer
</footer>
<!-- end footer -->

</body>

Features

  • Nested extending
  • Nested including

Install

$ npm install --save-dev gulp-html-extend

Syntax

P.S. [=] means the = sign is optional.

@@master [=] path [jsonString]

e.g. <!-- @@master master.html {"foo":"bar"} -->

@@placeholder [=] blockName

e.g. <!-- @@placeholder footer -->

@@include [=] path [jsonString]

e.g. <!-- @@include /footer.html {"foo":"bar"} -->

@@var [=] variableName

e.g. <!-- @@var foo -->

@@block [=] blockName

e.g. <!-- @@block footer -->

@@close

You must add <!-- @@close --> at the end of every block

Usage

var gulp = require('gulp')
var extender = require('gulp-html-extend')

gulp.task('extend', function () {
    gulp.src('./*.html')
        .pipe(extender({annotations:true,verbose:false})) // default options
        .pipe(gulp.dest('./output'))

})
gulp.task('watch', function () {
    gulp.watch(['./*.html'], ['extend'])
})

...

Options

annotations [bool]

Make it false if you dont want <!-- start foo.html --> in output files.

verbose [bool]

Show extra info in the console.

root [string (dir path)]

Enable absolute paths which start with /.

Changelog

  • 1.2.0 Supoort multiply-lines json
  • 1.1.6 variable default value @var foo "defaultValue"
  • 1.1.4 add testing for only includings case.
  • 1.1.3 absolute path bug fix #7
  • 1.1.2 cwd bug fix #6
  • 1.1.0 Support absolute path {root: "path/relative/to/cwd"}
  • 1.0.0 No much changes
  • 0.5.0
    • @@var support for @@include
    • = is optional
  • 0.4.1 @@var bugs fixed
  • 0.4.0 @@var support for @@master
  • 0.3.2 Fix bugs of testing
  • 0.3.1 Add the verbose option {verbose: true}
  • 0.3.0 You can include another file in an included file (nested including).
  • 0.2.0 Annotations can be disabled via an option {annotations:false}
  • 0.1.3 Add including annotations.
  • 0.1.2 Include path bug fixed.
  • 0.1.0 Add @@include = foo.html support

License

MIT © Frank Fang