npm 在终端命令下执行装包，就会在该目录下产生一个node_modules包

art-template地址：https://aui.github.io/art-template/zh-cn/docs/

安装  npm install art-template --save

1.单纯的在node环境某个js文件中引入'art-template文件

调用 template.render(source, data, options)方法 source string类型

const template = require('art-template')

// template.render(source, data, options);

let htmlStr = `

<!DOCTYPE html>

<html lang="en">

<head>

  <meta charset="UTF-8">

  <meta name="viewport" content="width=device-width, initial-scale=1.0">

  <title>Document</title>

</head>

<body>

  <p>{{msg}}</p>

  <div>{{each list}} {{$index}}---{{$value}} {{/each}}</div>

  <div>{{each user}} {{$index}}---{{$value}} {{/each}}</div>

    <ul>

        {{each list}} <li>{{$value}}</li> {{/each}}

    </ul>

</body>

</html>

`

const data = {

  msg: 'aaa',

  list: [10, 20, 30],

  user: {

    name: 'zs',

    age: 10,

    gender: 'male'

  }

}

let res = template.render(htmlStr, data)

console.log(res);

以下是输出内容

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>
</head>
<body>
  <p>aaa</p>
  <div> 0---10  1---20  2---30 </div>
  <div> name---zs  age---10  gender---male </div>
    <ul>
         <li>10</li>  <li>20</li>  <li>30</li>
    </ul>
</body>
</html>

可以看出输出的渲染数据后的html字符串，如果后台将这个html字符串作为响应内容response发给前端，前端浏览器拿到后会自动解析出里面的html标签，就是常见的惠网页内容。这个就是后端渲染的最简单的原理。

2.把网页内容放在html文件中，在总模块中引入fs模块，读取html文件。抽离出HTML文件

3.结合网络传输，给浏览器发送真实的网页内容

5 art-template的更多相关文章

  1. art template前端模板引擎

    偶然看到后台有一段代码 采用的是art template的模板引擎 地址为 http://aui.github.io/artTemplate/ 这段代码很简洁 var html = template( ...

  2. art.template 循环里面分组。

    后台提供给我们一个数组,我们要用模版实现上面的格式输出怎么版呢? 下面就是解决方案: <h2>循环4个一组</h2> <script type="text/ht ...

  3. 利用art.template模仿VUE 一次渲染多个模版

    TypeScript代码 import template = require('art-template/lib/template-web'); interface TemplateBindConfi ...

  4. 利用art.template模仿VUE

    首先先看一下Typescript代码: import template = require('art-template/lib/template-web'); interface TemplateBi ...

  5. js 模板引擎 -Art Template

    一个例子涵盖所有: <!doctype html> <html> <head> <meta charset="UTF-8"> < ...

  6. 一分钟上手artTemplate

    一分钟上手artTemplate artTemplate是腾讯开源的前端模版引擎.之前做hue二次开发,只接触过用python写的mako模版引擎,所以之前对前端模版引擎了解不是很多. 这次因为pm叫 ...

  7. Express使用art-template模板引擎

    第一步:安装 npm install --save art-template npm install --save express-art-template 第二步:指定.html使用的解析引擎(官方 ...

  8. vscode开发中绝对让你惊艳的插件！！！(个人在用)

    识别模版引擎 1.Apache Velocity :识别Velocity(vm) 2.Art Template Helper:识别artTemplate 点击路径跳转 1.Laravel goto v ...

  9. ES6/ES2015的一些特性的简单使

    1.一些常用的ES6的特性: let, const, class, extends, super, arrow functions, template string, destructuring, d ...

  10. artTemplate子模板include

    art.Template:https://github.com/aui/art-template 下面来实现利用模版来实现递归调用生成tree <script type="text/h ...

随机推荐

  1. windows下Nginx+RTMP部署

    在windows下部署参考博客:https://blog.csdn.net/l1028386804/article/details/80022437 参考这个部署完成后,一般没有什么问题,可以看到视频 ...

  2. 一文搞定Python正则表达式

    本文对正则表达式和 Python 中的 re 模块进行详细讲解 很多人学习python,不知道从何学起.很多人学习python,掌握了基本语法过后,不知道在哪里寻找案例上手.很多已经做案例的人,却不知 ...

  3. Navicat Premium 安装破解

    软件官网 : https://www.navicat.com.cn/ Navicat Premium 12 下载地址:https://www.lanzous.com/i9j0syf 密码:7pup N ...

  4. Assembly.LoadFrom() 方法加载程序集，无法转换类型

    有些情况在开发一个C#框架的时候,要用到反射加载另外程序集,这是必然考虑的事情.这样做的好处就是多个工程同时作业的时候,可以互不干扰,替换DLL文件即可. Assembly.Load();这个方法只能 ...

  5. STL函数库的应用第一弹——数据结构（队列）

    队列是什么? 队列是一种特殊的线性表,特殊之处在于它只允许在表的前端进行删除操作,而在表的后端进行插入操作. 和栈一样,队列是一种操作受限制的线性表.进行插入操作的端称为队尾,进行删除操作的端称为队头 ...

  6. 使用grub2引导进入Linux或Window系统

    很多人在一通烂搞之后把自己的grub搞崩了(比如我当时手贱删除了boot分区)虽然后来又装了grub,但是进入grub后还是没有引导,只有一个孤零零的命令行界面 这时候应该怎么办呢?首先当然是想进入系 ...

  7. Kafka工作流程

    Kafka生产过程分析 1 写入方式 producer采用推(push)模式将消息发布到broker,每条消息都被追加(append)到分区(patition)中,属于顺序写磁盘(顺序写磁盘效率比随机 ...

  8. Java——注解

    注解的产生背景以前,xml以低耦合的方式得到了广大开发者的青睐,xml在当时基本上能完成框架中的所有配置.但是随着项目越来越庞大,xml的配置也越来越复杂,维护性也随之降低,维护成本增高.于是就产生了 ...

  9. GPU虚拟机创建时间深度优化

    ​桔妹导读:GPU虚拟机实例创建速度慢是公有云面临的普遍问题,由于通常情况下创建虚拟机属于低频操作而未引起业界的重视,实际生产中还是存在对GPU实例创建时间有苛刻要求的业务场景.本文将介绍滴滴云在解决 ...

  10. 服务器里Centos 7安装KVM，并通过KVM安装Centos 7

    一.安装KVM 1.进入系统后,检查cpu参数是否支持虚拟化: [root@localhost ~]# grep -Ei 'vmx|svm' /proc/cpuinfo 如果有出现vmx或者svm关键 ...