ejs和glob用法详解

ejs用法

cnpm i -S ejs@3.1.5

ejs模板的三种用法

1.返回function，用于解析html中的ejs模版

创建lib/ejs/index.js文件；

const ejs = require("ejs");

const html = "<div><%= user.name %></div>";
const options = {};
const data = {
  user: {
    name: "mj",
  },
};

// 返回function，用于解析html中的ejs模版，这个步骤比较消耗性能
const template = ejs.compile(html, options);

const compileTemplate = template(data);

console.log(compileTemplate);

输入命令，中间的name就会变成mj；

2.直接调用ejs.render

const renderedTemplate = ejs.render(html, data, options);

用法一和二的区别就是是否会对compile反复的使用，render更适合一次性的；

3.renderFile

创建lib/ejs/template.html文件；

<div><%= user.name %></div>

const renderedFile = ejs.renderFile(
  path.resolve(__dirname, "template.html"),
  data,
  options
);

console.log(renderedFile);

会返回promise对象；

还可以通过这种方式打印；

renderedFile.then((file) => console.log(file));

ejs标签含义

<% %>中的内容是javaScript； 写一段for循环在ejs中；

<%for(var i = 0; i < 10;i++){%>
<div><%= user.name %></div>
<%}%>

<% '脚本'标签，用于流程控制，无输出
<%_ 用来删除前面的空格
<%= 输出数据到模版
<%- 输出非转义的数据到模板
<%# 注释标签、不执行、不输出内容
<%% 输出字符串 '<%'
%> 一般结束标签
-%> 删除紧随其后的换行符
_%> 将结束标签后面的空格符删除

<%- 输出非转义的数据到模板🌰

const data = {
  user: {
    name: "mj",
    nickName: "<div>111</div>",
  },
};

<div><%= user.name %></div>
<%_ %><%- user.nickName %>

ejs模板几种特殊用法

1.包含include

<div><%= user.name %></div>
<%_ %><%- user.nickName %> 
<%- include('./footer.html', { user }) %>

<div>footer</div>

2.自定义分隔符 在options中定义：

const callbackOptions = {
  delimiter: "?",
};
const renderedFile = ejs.renderFile(
  path.resolve(__dirname, "template.html"),
  data,
  callbackOptions
);
renderedFile.then((file) => console.log(file));

<div><?= user.name ?></div>

3.自定义文件加载器

ejs.fileLoader = function (filePath) {
  console.log("filePath--->", filePath);

  const content = fs.readFileSync(filePath).toString();
  return "<div>top content</div>" + content;
};

glob介绍

glob最早出现在类Unix系统的命令行中，用来匹配文件路径的。比如，lib/**/*.js匹配lib目录下所有的js文件；有了glob，匹配文件路径变得so easy～～

cnpm i -S glob@7.1.6

创建lib/ejs/glob.js

const glob = require("glob");

// **是跨路径匹配
glob("**/*.js", {}, function (err, file) {
  console.log(err, file);
});

const glob = require("glob");

// 加上ignore选项就可以忽略特定的文件
glob("**/*.js", { ignore: ["process/index.js"] }, function (err, file) {
  console.log(err, file);
});