在node和express中配置使用art-template
前导知识：art-template模板引擎的语法和基本使用
可以在 浏览器中使用art-template，也可以在node中使用art-template
在node中使用art-template
art-template的API
模板引擎最早诞生于服务器端，使用的是服务端渲染。本质是字符串的解析替换，服务器处理好数据后才将最终的页面代码发给浏览器。
方式1：template.render(source, data, options)，编译并返回渲染结果
参数：
- 第一个参数是模板字符串，string类型
- 第二个参数是数据对象
返回值：是渲染好的字符串
示例
var html = template.render('hi, <%=value%>.', {
value: 'aui'});
方式2：template(filename, content)，根据模板名渲染模板。
参数：第一个参数filename是文件名，string类型
返回值：
- 如果
content为Object，则渲染模板并返回string - 如果
content为string，则编译模板并返回function
方式3：template.compile(source, options)，编译模板并返回一个渲染函数。
- 第一个参数是模板字符串
- 返回值是一个渲染函数，类似于template.render()函数
var render = template.compile('hi, <%=value%>.');
var html = render({
value: 'aui'});
案例：
<html lang="en">
<head>
<meta charset="UTF-8">
<title>{
{title}}title>
head>
<body>
<h1>{
{name}}h1>
<h2>{
{age}}h2>
body>
html>
// 方式1：使用 template.render
let template = require('art-template');
let http = require('http');
let server = http.createServer(function (req, res) {
let fs = require('fs');
fs.readFile('./01.html', function (err, data) {
let htmlStr = template.render(data.toString(), {
title: "测试",
name: "webchang",
age: 18
})
res.end(htmlStr)
})
});
// 方式2:
let htmlStr = template('./01.html', {
title: "测试",
name: "webchang",
age: 18
});
res.end(htmlStr);
在Express中配置使用art-template
Express - art-template 官方文档
安装：
npm install art-template
npm install express-art-template
- express-art-template是专门用来在Express中把 art-template 整合到 Express中的
- 这里需要安装art-template，原因就在于express-art-template依赖了art-template
使用:
let express = require('express');
let app = express();
/**
* 配置使用art-template模板引擎，这行代码是关键
* 第一个参数表示当渲染以 .art 文件结尾的文件的时候，使用art-template。可以把art改成html
* */
app.engine('art',require('express-art-template'));
/**
* Express为response对象提供了一个方法：render
* render方法默认是不可用的，如果配置了模板引擎就可以用了
* res.render('html模板名',{数据})，第二个参数可选
* render函数的第一个参数不能写路径，默认会去项目中的views目录中查找该模板文件
* 也就是说Express有一个约定，开发人员把所有的视图文件都放到views目录中
* */
app.get('/',function (req,res) {
res.render('index.art',{
title:'hello'
})
});
app.get('/admin',function (req,res) {
// 此处的路径是相对于 views 文件夹
res.render('admin/admin.art',{
title:"我是admin"
});
});
如果想要修改默认的views目录，则可以
// 第一个参数必须是 “views”
app.set('views',新的默认路径)