最近一个 node 项目里有这样的场景，为了前后端统一，前端开发的时候使用 ejs 模板开发，使用 gulp 进行打包，使用 gulp-ejs 传值一些预览数据再进行 gulp 打包，这样前端打包后就能看到相应的预览 html 文件，后端就可以直接将 ejs 文件作为 view 模版直接进行使用。但是 ejs 传值的时候有个限制，如下
var ejs = require('gulp-ejs')
var gutil = require('gulp-util')
gulp.src('./templates/*.ejs')
.pipe(ejs({
msg: 'Hello Gulp!'
}).on('error', gutil.log))
.pipe(gulp.dest('./dist'))
但是这样存在一个限制，要么传入所有的 ejs 文件，所有的的值都传入，要么一个个 ejs 都导入，可以传入单个文件的值，但是哪种方法都无可避免带来很不优雅的代码，文件冗余，经过查看源码给出一种解决方案。可以遍历 views 下所有的 ejs 文件，根据 ejs 文件的文件名作为索引，在外部建立一个 json 文件，根据 ejs 文件名查找对应的 value，赋值给 gulp-ejs 去渲染。以下是实现方法。
gulp.task('ejsCompile', function () {
fs.readdirSync(__dirname + "/src/app")//遍历文件
.filter(function (file) {
return (file.indexOf("_") !== 0) && (file.endsWith('.ejs'));//过滤以_开头和不是ejs文件
})
.forEach(function (file) {
console.log(file)
let name = file.substring(0, file.length - 4)
let value;
if(cfg.hasOwnProperty(name)){//cfg 为 存放数据的配置文件
value = cfg[name];
} else {
value = {}
}
console.log(name)
console.log(value)
gulp.src('src/app/' + file)
.pipe(ejs(value))//传入值进行渲染
.pipe(rename(function(path){
path.extname = ".html";
}))
.on('error',gutil.log)
.pipe(gulp.dest('dist/app'));
})
})
