源于 Node.js的HTML 模板引擎Jade的一个hello world项目- 前端开发

Jade 是一个高性能的模板引擎，它深受 Haml 影响，它是用 JavaScript 实现的，并且可以供 Node 使用。其使用也是非常简单易学的。

我们现在看一下如何用Jade做一个最简单的nodejs hello world应用。

在nodejs应用的package.json里引入对jade的依赖：

在nodejs代码中使用如下代码设置express返回的app实例使用的视图引擎：

var app = express();

// view engine setup
app.set('views', path.join(__dirname, 'views'));
app.set('view engine', 'jade');

按照下图的方法设置待渲染的视图，名称为index：

router.get('/', function(req, res, next) {
  res.render('index', { title: 'CoreSystem Proxy Project' });
  res.send('hahahaha,my god!');
});
1
2
3
4

在views文件夹里新建一个同名视图模板index.jade，内容如下：

extends layout

block content
  h1= title
  p Welcome to #{title}

模板源文件里通过井号和大括号包裹的变量title，运行时会被模型字段title的值：CoreSystem Proxy Project所替换，如下图所示：

要获取更多Jerry的原创文章，请关注公众号"汪子熙":

源于 Node.js的HTML 模板引擎Jade的一个hello world项目