本文概要
- 什么是模板引擎
- 使用模板引擎与Express
- Pug模板引擎
- 安装Pug
以下是一些常用的模板引擎与Express.js工作的列表:
- Pug (formerly known as jade)
- mustache
- dust
- atpl
- eco
- ect
- ejs
- haml
- haml-coffee
- handlebars
- hogan
- jazz
- jqtpl
- JUST
- liquor
- QEJS
- swig
- templayed
- toffee
- underscore
- walrus
- whiskers
使用模板引擎与快递模板引擎让你可以在你的应用程序中使用静态模板文件。为了使模板文件,你必须设置以下应用程序设置属性:
- Views:它指定模板文件所在的目录。
- 视图引擎:它指定了你使用模板引擎。例如,要使用 pug 模板引擎:app.set(“视图引擎”,“pug”)。
pug模板引擎让我们来学习如何使用Express.js使用pug模板引擎的Node.js应用。pug是Node.js的模板引擎,pug使用空格和缩进作为语法的一部分。其语法是aesy学习。
安装pug执行以下命令来安装pug模板引擎:
npm install pug --save
文章图片
pug模板必须.pug文件中写入所有.pug文件必须放在内部意见的Node.js应用程序的根目录文件夹中。
【Express.js模板】注意:默认情况下Express.js搜索在视图中的所有意见的根文件夹下的文件夹中。你还可以设置到另一个文件夹中明确使用视图属性。例如:app.set( ‘ 视图’ , ‘ MyViews’ )。
pug模板引擎需要以简单的方式输入和产生输出的HTML。看看它是如何渲染HTML:
简单的输入:
doctype html
html
head
title A simple pug example
body
h1 This page is produced by pug template engine
p some paragraph here..
通过pug模板产生输出:
<
!DOCTYPE html>
<
html>
<
head>
<
title>A simple pug example<
/title>
<
/head>
<
body>
<
h1>This page is produced by pug template engine<
/h1>
<
p>some paragraph here..<
/p>
<
/body>
<
/html>
Express.js可以与任何模板引擎使用。让我们举个例子来部署pug模板如何动态生成HTML页面。
见下面的例子:
创建一个文件名为index.pug文件内部意见文件夹,并写了以下pug模板:
doctype html
html
head
title A simple pug example
body
h1 This page is produced by pug template engine
p some paragraph here..
文件:server.js
var express = require('express');
var app = express();
//set view engine
app.set("view engine","pug")
app.get('/',function (req,res) {
res.render('view.pug',index);
res.render('index');
});
var server = app.listen(5000,function () {
console.log('Node server is running..');
});
推荐阅读
- Express.js脚手架
- Express.js中间件
- Express.js文件上传
- Express.js Cookie
- Express.js路由
- Express.js POST请求
- Express.js GET请求
- Express.js响应Response
- Express.js请求