Express 是一个基于 Node.js 平台的极简、灵活的 web 应用开发框架,它提供一系列强大的特性,帮助你创建各种 Web 和移动设备应用。

express官网:http://www.expressjs.com.cn/

通过应用生成器工具 express 可以快速创建一个应用的骨架。

通过如下命令安装:

$ npm install express-generator -g

-h 选项可以列出所有可用的命令行选项:

$ express -h

  Usage: express [options] [dir]

  Options:

    -h, --help          output usage information
-V, --version output the version number
-e, --ejs add ejs engine support (defaults to jade)
--hbs add handlebars engine support
-H, --hogan add hogan.js engine support
-c, --css <engine> add stylesheet <engine> support (less|stylus|compass|sass) (defaults to plain css)
--git add .gitignore
-f, --force force on non-empty directory

例如,下面的示例就是在当前工作目录下创建一个命名为 myapp 的应用。

$ express myapp

   create : myapp
create : myapp/package.json
create : myapp/app.js
create : myapp/public
create : myapp/public/javascripts
create : myapp/public/images
create : myapp/routes
create : myapp/routes/index.js
create : myapp/routes/users.js
create : myapp/public/stylesheets
create : myapp/public/stylesheets/style.css
create : myapp/views
create : myapp/views/index.jade
create : myapp/views/layout.jade
create : myapp/views/error.jade
create : myapp/bin
create : myapp/bin/www

然后安装所有依赖包:

$ cd myapp
$ npm install

启动这个应用(MacOS 或 Linux 平台):

$ DEBUG=myapp npm start

Windows 平台使用如下命令:

> SET DEBUG=myapp:* & npm start

然后在浏览器中打开 http://localhost:3000/ 网址就可以看到这个应用了。i

通过 Express 应用生成器创建的应用一般都有如下目录结构:

.
├── app.js
├── bin
│   └── www
├── package.json
├── public
│   ├── images
│   ├── javascripts
│   └── stylesheets
│   └── style.css
├── routes
│   ├── index.js
│   └── users.js
└── views
├── error.jade
├── index.jade
└── layout.jade 7 directories, 9 files

1.
先执行$ npm install express-generator -g
然后

然后在浏览器中打开 http://localhost:3000/ 网址就可以看到这个应用了。


swig 是node端的一个优秀简洁的模板引擎,类似Python模板引擎Jinja,目前不仅在node端较为通用,相对于jade、ejs优秀,而且在浏览器端也可以很好地运行。

这是官方文档

安装swig

$ npm install swig --save

在express中使用swig

在express框架中,默认的模版是jade,更改为swig模版引擎。

修改packge.json

"jade": "~1.11.0",改为 "swig": "^1.4.2",

 {
"name": "myapp",
"version": "0.0.0",
"private": true,
"scripts": {
"start": "node ./bin/www"
},
"dependencies": {
"body-parser": "~1.17.1",
"cookie-parser": "~1.4.3",
"debug": "~2.6.3",
"express": "~4.15.2",
"morgan": "~1.8.1",
"serve-favicon": "~2.4.2",
"swig": "^1.4.2"
}
}

修改app.js

 var app = express();
app.set('view engine', 'jade');
// 把上面的代码改为下面的
// view engine setup
var app = express();
var swig = require('swig');
app.engine('html', swig.renderFile); //使用swig渲染html文件
app.set('view engine', 'html'); //设置默认页面扩展名
app.set('view cache', false); //设置模板编译无缓存
app.set('views', path.join(__dirname, 'views')); //设置项目的页面文件,也就是html文件的位置
swig.setDefaults({cache: false}); //关闭swig模板缓存
swig.setDefaults({loader: swig.loaders.fs(__dirname + '/views')}); //从文件载入模板,请写绝对路径,不要使用相对路径

然后把原来的views文件夹下得文件后缀都改为html

模板文件layout.html

 <!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>{% block title %}{% endblock %}</title>
{% block head %}
{% endblock %}
</head>
<body>
{% block content %}{% endblock %}
</body>
</html>

index.html

 {% extends 'layout.html' %}

 {% block title %}index {{title}} {%endblock%}

 {% block head %}
{{title}}
{% endblock %} {% block content %}
<p>This is just an awesome page.</p>
{% endblock %}

然后再路由中设置即可使用:

routes\index.js

 router.get('/', function(req, res, next) {
res.render('index', { title: '标题' });
});

之后我在命令行里执行  $ SET DEBUG=myapp:* & npm start

出现错误

于是我又在myapp文件夹下再次执行 $ npm install swig --save

然后终于对了,在myapp\node_modules\.bin 里面出现 swig 跟 swig.cmd

参考文档:http://blog.csdn.net/duola8789/article/details/70157900

express 4.x+ swig的更多相关文章

  1. swig模板引擎汇总

    1. Express中使用swig模板引擎 2.Swig 使用指南 3.jade to html online

  2. NodeJS中使用swig模板引擎

    NodeJS中的默认引擎是jade有点过于复杂,而且不是以HTML为基础的,学习成本和前端适应成本都很大.而ejs虽然简单,但不支持模板导入,而且效率一般. swig的语法简单,学习成本很低,符合常规 ...

  3. nodejs上传图片模块做法;

    服务端代码: var express = require('express'); var swig = require('swig'); //1.引入multer模块 var multer = req ...

  4. nodejs 备忘

    引入模块(在于你用什么模块,需要的模块可以用终端进行安装, npm,一般express,swig,body-parser,cookies,markdown) 设置模块 设置渲染 var express ...

  5. Node.js-视图引擎【1】-Swig集成express的安装与配置

    node.js视图引擎,选来选去发现Swig最符合我的胃口哈哈. 一.安装Swig视图引擎 npm install -g swig 二.在node.js代码中配置如下 var app = requir ...

  6. node.js—express+ejs、express+swig、

    安装:npm install -g express-generator 普通express 网站 创建:express testWeb 安装依赖:npm install 修改app.js文件并运行 找 ...

  7. Swig 使用指南 (express模板)

    如何使用 API swig.init({ allowErrors: false, autoescape: true, cache: true, encoding: 'utf8', filters: { ...

  8. express+gulp构建项目(五)swig模板

    这里的文件负责配置swig模板引擎. index.js var jsonHash = require('./json_file'); var staticTag = require("./t ...

  9. express+gulp构建项目(二)启动项目和主文件

    这一次整理的内容是项目主文件和如何启动项目. 启动项目 通过nodejs官网的例子https://nodejs.org/docs/latest-v4.x/doc/api/synopsis.html我们 ...

随机推荐

  1. spring与mybatis整合(基于配置文件)

    本文主要介绍了如何将mybatis和spring整合在一起使用,本人使用的是mybatis3.05 + spring3.1.0M2 ,使用dbcp作为数据库连接池. 1.编写数据访问接口(UserDa ...

  2. struts2 action中获取request session application的方法

    共四种方式: 其中前两种得到的是Map<String,Object>  后两种得到的才是真正的request对象 而Map就是把request对象中的属性取出做成了键值对而已. [方法一] ...

  3. flask - 1

    from flask import Flask app = Flask(__name__) @app.route('/') def hello_world(): return 'Hello, Worl ...

  4. 【SSH】——hql的使用方式及实现原理

    [含义] hql,即Hibernate Query  Language.它与我们熟知的sql很类似,它最大的特点就是对查询进行了面向对象的封装,下面会在具体例子中说明. sql查询的是数据库中的表或字 ...

  5. 多线程 定时器 Timer TimerTask

    定时器是一种特殊的多线程,使用Timer来安排一次或者重复执行某个任务 package org.zln.thread; import java.util.Date; import java.util. ...

  6. android开发中常犯的几个错误整理

    新手程序猿,在开发中难免会犯各种各样的错误,以下是整理的一些android开发中常见的错误,一起来看看吧. 1.避免将多个类放在一个文件夹里面,除非是一次性使用的内部类. 就是一个文件,最好给分它同名 ...

  7. JSON语法(3)

    JSON语法是JavaScript语法的子集. JSON语法规则 数据在名称/值对中 数据由逗号分割 花括号保存对象 方括号保存数组 JSON名称/值对 JSON数据的书写格式是:名称/值对. 名称/ ...

  8. hdu 1133 Buy the Ticket (大数+递推)

    Buy the Ticket Time Limit: 2000/1000 MS (Java/Others)    Memory Limit: 65536/32768 K (Java/Others)To ...

  9. 斜率dp+cdq分治

    写在前面 这个东西应该是一个非常重要的套路......所以我觉得必须写点什么记录一下,免得自己忘掉了 一直以来我的斜率dp都掌握的不算很好......也很少主动地在比赛里想到 写这个的契机是noi.a ...

  10. 【BZOJ 2241 打地鼠】

    Time Limit: 10 Sec  Memory Limit: 512 MBSubmit: 1430  Solved: 908[Submit][Status][Discuss] Descripti ...