express 4.x 模板引擎与express.static
前提:要在express中使用模块引擎需要将要使用的模板引擎安装在本项目,当然,express也是要安装的。在下面实例中,我使用的模板引擎是pug(一起叫做jade)
我的目录结构如下:

根目录为static,根目录下的public文件夹,是静态文件(如图片文件,css文件,js文件de)根目录。根目录下的view是模板文件的根目录。根目录中的app.js是启动文件,
代码如下:
//引入必要的模块
//express.static是express 4.0中唯一的内置中间件,不需要额外引入
var express = require('express'); var app = express(); //将模板引擎设置为pug,也可以设置为其他的,在这里我已经安装了pug
app.set('view engine','pug'); //设置模板文件存放的目录,我将所以的模板文件存在在view文件夹
//它的意思是将模板文件放在与当前文件相同目录级的view文件夹中
app.set('views','view'); //将express.static作为一个中间件
//它的意思是在public中去加载静态文件,public位于与当前文件相同目录级
app.use(express.static('public')); app.get('/',function(req,res){
//渲染view文件夹中index.pug模板,由于前面已经设置了模板引擎为pug,所以这里可以不加后缀名
res.render('index');
});
app.listen(3000,function(){
console.log('reading');
});
index.pug文件的代码如下
doctype html
html
head(lang='en')
title index
meta(charset='utf-8')
//- 由于在app.js中将express.static()的第一个参数设置为了public,
//- 所以会在public中去找css/test/css,就算写成./../css/test.css等,也是
//- 在public中去找css/test.css,不管在css/test.css前加多少个点,req.url都是css/test.css
link(type='text/css',rel='stylesheet',href='css/test.css')
body
| index
script(type='text/javascript',src='js/index.js')
express 4.x 模板引擎与express.static的更多相关文章
- Express ( MiddleWare/中间件 路由 在 Express 中使用模板引擎 常用API
A fast, un-opinionated, minimalist web framework for Node.js applications. In general, prefer simply ...
- express中ejs模板引擎
1.在 app.js 中通过以下两个语句设置了 引擎类型 和页面模板的位置: app.set('views', __dirname + '/views'); app.set('view engine' ...
- nodejs学习(二) ---- express中使用模板引擎jade
系列教程,上一节教程 express+nodejs快速创建一个项目 在创建一个项目后,views目录下的文件后缀为 .jade . 打开 index.jade,具体内容如下图(忽略 header.j ...
- express使用ejs模板引擎渲染html文件
小场景小知识点. 在使用express过程中,按照官网教程,利用express生成器很容易初始化express项目模板. 那么初始化项目之后应该如何使用ejs作为模板引擎呢?如下 // 注释掉默认生成 ...
- express 使用art-template模板引擎
下载express-art-template art-template - app.js中配置 - 注册一个模板引擎 - `app.engine('.html',express-art-templat ...
- Express使用art-template模板引擎
第一步:安装 npm install --save art-template npm install --save express-art-template 第二步:指定.html使用的解析引擎(官方 ...
- Express开发实例(2) —— Jade模板引擎
前一篇通过helloworld,简单介绍了Express中的开发,本篇继续深入的学习express的模板. 关于Jade的用法,网上有很多,本篇参考:Jade语法 安装相关模块 在实验代码前,应该先安 ...
- 【转】在Express项目中使用Handlebars模板引擎
原文:http://fraserxu.me/2013/09/12/Using-Handlebarsjs-with-Expressjs/ 最近在用Expressjs做一个项目,前后端都用它来完成.自己之 ...
- Express:模板引擎深入研究
深入源码 首先,看下express模板默认配置. view:模板引擎模块,对应 require('./view'),结合 res.render(name) 更好了解些.下面会看下 view 模块. v ...
随机推荐
- lwip:网络数据包读取和解析过程
1. 程序的某处(poll or interrupt)在有数据可读时调用ethernetif_input,该函数依次调用以下函数: 1.1 low_level_input(),将网络数据读入内存: 1 ...
- 服务器判断客户端为移动端还是PC端
public void ProcessRequest(HttpContext context) { context.Response.ContentType = "text/html&quo ...
- Visual Assist 生成注释功能
在Visual Studio环境中编码,Visual Assist是不可缺少的好工具.这工具功能非常强大,以前仅仅用到了代码提示,今天学习了生成注释功能,非常爽. 在代码编辑器中点击右键弹出菜单,在“ ...
- chmod 权限777 是什么意思(Unix和Linux的各种操作系统下)
在Unix和Linux的各种操作系统下,每个文件(文件夹也被看作是文件)都按读.写.运行设定权限.例如我用ls -l命令列文件表时,得到如下输出:-rw-r--r-- 1 bu users 2254 ...
- M2的来源很简单
http://bbs.tianya.cn/post-develop-412703-1.shtml M2的来源很简单,一部分是外汇占款,这个是我们国家的缺陷,如果外汇不管制,其实是不会发生增长人民币的 ...
- html中div定位练习
html中div定位练习,实现简单的计划列表: 记录div定位时主要的属性:float.position等,以及对应的relative和absolute等,同时使用到angular js中的数据绑定, ...
- IOS中UIWebView停止加载
方法一: [webView loadRequest:[NSURLRequest requestWithURL:[NSURL URLWithString:@"about:blank" ...
- [MySQL] 常用SQL技巧--18.5
1.正则表达式使用 MySQl利用REGEXP命令,提供正则表达式功能. 例子:select 'abcdef' REGEXP '^a'; select 'efg' REGEXP '[^XYZ]'; 2 ...
- EasyUI-draggable
draggable用来在界面上创建一个可以拖动的元素,既然是可以拖动的元素,那么它在拖动过程中会有下面的几个事件:onBeforeDrag.onStartDrag.onDrag.onStopDrag. ...
- 转--android Toast大全(五种情形)建立属于你自己的Toast
Toast用于向用户显示一些帮助/提示.下面我做了5中效果,来说明Toast的强大,定义一个属于你自己的Toast. 1.默认效果 代码 Toast.makeText(getApplicationCo ...