是  插件，它提供了一个 include 方法让我们可以像后端模板那样把公共部分的页面导入进来。

安装依赖包（包括了 gulp-file-include 和 del）

npm install --save-dev gulp-file-include del

项目结构目录

修改 gulpfile.js，结合 browser-sync 一起使用

'use strict';var gulp = require('gulp'),    del = require('del'),    fileinclude = require('gulp-file-include'),    browserSync = require('browser-sync').create();// 清除 dist 文件夹gulp.task('clean', function () {    return del.sync('./app/dist');});// html 整合gulp.task('html', function () {    return gulp.src('./app/src/template/*.html')    .pipe(fileinclude())    .pipe(gulp.dest('./app/dist'));});// 配置服务器gulp.task('serve', function () {    browserSync.init({        server: {            baseDir: './app/dist'        },        port: 8000    });    // 监听 html    gulp.watch('./app/src/template/**/*.html', ['html']).on('change', browserSync.reload); }); gulp.task('default', ['clean', 'html', 'serve']);

html:

    
         
         
             @@include('inc/header.html', {"title": "home"})    

header.html:

@@title

打包：

gulp

浏览器会自动打开页面 http://localhost:8000，显示 home。在 dist 文件夹中查看 index.html：

    
         
         
             
home
    

当然， 还有很多强大的功能，具体内容可以参考，这里我就不多说了。