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标签,就是常见的惠网页内容。这个就是后端渲染的最简单的原理。