EJS npm install ejs --save-dev
这是一个功能很经典而且使用非常简单的JS模板引擎.
gulp-ejs插件 npm install gulp-ejs --save-dev
首先创建个html模板.
ejs.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title><%=title %></title>
</head>
<body>
标题 :<%=title %>
<hr/>
相关新闻:<br />
<ul>
<%for(var i in list){%>
<li><%=list[i].name%></li>
<%}%>
</ul>
</body>
</html>
gulpfile.js
var gulp_ejs = require("gulp-ejs");//插件
gp.task("info",function(){
var data = {//手动建立数据源
title:"要好好学习啊!",
list:[
{name:"zhoubin"},
{name:"yuanjie"},
{name:"laopo"}
]
};
gp.src(["ejs.html"])
.pipe(gulp_ejs(data))
.pipe(gp.dest("./build/html"));
}
);
另外,如果请求获取数据,然后填充到html,怎么做呢 ?
这个是get请求获取数据。
以下是处理数据;
var gp_ejs=require('gulp-ejs');
gp.task('news2',function () {
var gNews=require('slib');
gNews.loadNews(function (body) {
var news=JSON.parse(body);
gp.src(["ejs.html"])
.pipe(gp_tpl(news))
.pipe(gp_rename(news.id+'.html'))
.pipe(gp.dest("./build/html"));
});
});