A Browserify transform which merges HTML files and require it.
npm install --save-dev haribotify $ browserify script.js -o bundle.js -t [ haribotify ]var fs = require("fs");
var browserify = require("browserify");
browserify("./script.js")
.transform("haribotify")
.bundle()
.pipe(fs.createWriteStream("bundle.js"));Require html files:
var html = require('./html/base.html');Then the base.html is automatically transformed:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>This is base</title>
</head>
<body>
{{./components/main.html}}
</body>
</html>NOTE: The root path of components is where thier base html file (index.html in this case) is placed.
<div>This is the main component</div>to:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>This is base</title>
</head>
<body>
<div>This is the main component</div>
</body>
</html>You can change the formatting rule of components paths. Its default is /{{(.*?)}}/g
browserify().transform("haribotify", {
format: /regex/
})