您的位置：首页 > Web前端 > Node.js

nodejs小记之handlebars视图与静态文件布置

2016-01-15 07:53 671 查看

本文章只记录过程，不讲解原理。

具体handlerbars用法请查看本博客其它文章。

安装handlerbars

运行

npm install --save express3-handlebars

设置handlerbars引擎

再创建index.js里面的app之后，设置视图引擎。

var express = require('express');

var app = express();

var handlebars = require('express3-handlebars')
.create({defaultLayout:'main'});/*指明了默认布局*/
app.engine('handlebars',handlebars.engine);
app.set("view engine",'handlebars');

创建views目录

创建views目录防止handlebars文件。

在views目录下面创建layouts子目录，来放置通用的框架。

例如：views/layouts/main.handlerbars

<!doctype html>
<html>
<head>
新浪网
</head>
<body>
{{{body}}}  {{!-- 此处会被每个视图自己的html取代
类似java里面的继承后被重写的方法 --}}
</body>
</html>

views/home.handelbars

<h1>新浪网欢迎你</h1>

views/404.handelbars

<h1>404 - Not Found</h1>

views/500.handelbars

<h1>500 - Server Error</h1>

连接新实图

现在视图都已经设置好了，接下来我们必须将使用这些视图的新路由替换旧路由。

配置静态文件

咱们们先不着急进行测试，先把静态文件配置以后一起测试。

在项目下配置public目录，在其下创建img目录，放入logo.jpg。

然后把static中间件加在所有路由之前。

app.use(express.static(__dirname + ‘/public’));

public前一定要加“/”

css，js以及你所需要访问的静态文件都可以放在其下。

编写静态文件

测试

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理

标签：

相关文章推荐

新的分享

章节导航