ejs

什么是ejs

"E" 代表 "effective"，即【高效】。EJS 是一套简单的模板语言，帮你利用普通的 JavaScript 代码生成 HTML 页面。EJS 没有如何组织内容的教条；也没有再造一套迭代和控制流语法；有的只是普通的 JavaScript 代码而已。

特点

• 快速编译与绘制输出
• 简洁的模板标签：<% %>
• 自定义分割符（例如：用 替换 <% %>）
• 引入模板片段
• 同时支持服务器端和浏览器 JS 环境
• JavaScript 中间结果静态缓存
• 模板静态缓存
• 兼容 Express 视图系统

ejs的使用

1、使用npm安装ejs
$ npm install ejs

2. 新建index.ejs
   index.html

    
    
    
    


    <%= index %>

3. 引入ejs模块

const ejs = require('ejs');

4. 渲染ejs

const http = require('http');

http.createServer((req, res) => {
    if (req.url === '/') {
        res.writeHead(200, {
            'Content-Type': 'text/html' 
        });
        // 渲染文件 index.ejs
        ejs.renderFile('./views/index.ejs', {
            title: 'ejs-index',  // 渲染的数据key: 对应到了ejs中的title
            index: '首页'},  // 渲染的数据key: 对应到了ejs中的index
            (err, data) => {
            if (err ) {
                console.log(err);
            } else {
                console.log(data);
                res.end(data);
            }
        })
    }
}).listen(3002);

5. koa使用ejs
   配置koa-views

   const koaViews = require('koa-views');
   
   // 配置渲染文件路径 及文件后缀
   app.use(koaViews('./views', {
       extension: 'ejs'
   }));
   

   // 响应路由渲染文件

   router.get('/', async ctx => {
       await ctx.render('index', {
           title: 'ejs-index', // 渲染的数据key: 对应到了ejs中的title
           index: '首页'}, // 渲染的数据key: 对应到了ejs中的index
       });
   });
   

6. 语法
   <% :'脚本' 标签，用于流程控制，无输出
   %> :一般结束标签
   <%= :输出数据到模板（输出是转义 HTML 标签）
   <%- :输出非转义的数据到模板