安装gulp的前提是你已经有了nodejs的运行环境
1，新建项目：
mkdir gulp-file && cd gulp-file
2，初始化一下npm init
3，全局安装gulp：npm install -g gulp
4，在每个要使用gulp的项目中都单独安装一次：
npm install gulp --save-dev5，文件夹介绍
|-node_modules |-page // 生产环境的 html 存放文件夹 |-include // 公共部分的 html 存放文件夹 //header.html;footer.html |-*.html //layout.html |-dist // 编辑后的 html 文件 //生成layout.html gulpfile.js
6，
在新建的gulpfile.js，配置好gulp-file-include：
var gulp = require('gulp'); var fileinclude = require('gulp-file-include'); gulp.task('fileinclude', function() { // 适配page中所有文件夹下的所有html，排除page下的include文件夹中html gulp.src(['page/**/*.html','!page/include/**.html']) .pipe(fileinclude({ prefix: '@@', basepath: '@file' })) .pipe(gulp.dest('dist')); });
接着新建两个html文件，分别是头部和底部：
header.html
<h1>这是 header 的内容</h1>
footer.html
<h1>这是 footer 的内容</h1>
最后在新建一个html，把要用到的header和footer给include进来。
layout.html
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> </head> <body> @@include('include/header.html') <p> 这是 layout 的内容 </p> @@include('include/footer.html') </body> </html>
最后回到命令行工具里，执行gulp fileinclude：