gulp-include-inline
a plugin of gulp for file include
install
npm install gulp-include-inlineoptions
- options - type:
string, just as prefix, default@@, and basepath is default@file
fileinclude('@@')-
options - type:
object- prefix:
string, default@@ - suffix:
string, default'' - basepath:
string, default@file, it could be@root,@file,your-basepath - filters:
object, filters of include content - context:
object, context ofifstatement - indent:
boolean, defaultfalse
- prefix:
-
options.basepath - type:
string, it could be-
@root, include file relative to the dir wheregulprunning in -
@file, include file relative to the dir wherefilein example -
your-basepathinclude file relative to the basepath you give
-
fileinclude({
prefix: '@@',
basepath: '@file'
})fileinclude({
prefix: '@@',
basepath: '/home/'
})example
- @@include options - type:
JSON
index.html
<!DOCTYPE html>
<html>
<body>
@@include('./view.html')
@@include('./var.html', {
"name": "haoxin",
"age": 12345,
"socials": {
"fb": "facebook.com/include",
"tw": "twitter.com/include"
}
})
</body>
</html>view.html
<h1>view</h1>var.html
<label>@@name</label>
<label>@@age</label>
<strong>@@socials.fb</strong>
<strong>@@socials.tw</strong>gulpfile.js
var fileinclude = require('gulp-include-inline'),
gulp = require('gulp');
gulp.task('fileinclude', function() {
gulp.src(['index.html'])
.pipe(fileinclude({
prefix: '@@',
basepath: '@file'
}))
.pipe(gulp.dest('./'));
});and the result is:
<!DOCTYPE html>
<html>
<body>
<h1>view</h1>
<label>haoxin</label>
<label>12345</label>
<strong>facebook.com/include</strong>
<strong>twitter.com/include</strong>
</body>
</html>filters
<!DOCTYPE html>
<html>
<body>
@@include(markdown('view.md'))
@@include('./var.html', {
"name": "haoxin",
"age": 12345
})
</body>
</html>view.md
view
====var fileinclude = require('gulp-include-inline'),
markdown = require('markdown'),
gulp = require('gulp');
gulp.task('fileinclude', function() {
gulp.src(['index.html'])
.pipe(fileinclude({
filters: {
markdown: markdown.parse
}
}))
.pipe(gulp.dest('./'));
});
if statement
fileinclude({
context: {
name: 'test'
}
});@@include('some.html', { "nav": true })
@@if (name === 'test' && nav === true) {
@@include('test.html')
}
for statement
fileinclude({
context: {
arr: ['test1', 'test2']
}
});<ul>
@@for (var i = 0; i < arr.length; i++) {
<li>`+arr[i]+`</li>
}
</ul>
License
MIT
