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. 剑指offer-二叉树的镜像18

    题目描述 操作给定的二叉树,将其变换为源二叉树的镜像. 输入描述: 二叉树的镜像定义:源二叉树 8 / \ 6 10 / \ / \ 5 7 9 11 镜像二叉树 8 / \ 10 6 / \ / \ ...

  2. LeetCode - 66. Plus One(0ms)

    Given a non-empty array of digits representing a non-negative integer, plus one to the integer. The ...

  3. [译]在SQL查询中如何映射(替换)查询的结果？

    问题来源: https://stackoverflow.com/questions/38567366/mapping-values-in-sql-select 有一个表格,就称它Plant,它有三列: ...

  4. android-ViewList的通用ViewHold

    在写ViewList的时候要写Adapter的时候,经常大量的代码都是差不多的. 1 ViewHold 2 if(convertView ==null ){}else{} 3 setTag 4 FIn ...

  5. 编程练习：寻找发帖"水王"扩展问题一

    回顾 寻找发帖水王的问题总结起来就是在一个数组中某一个元素出现次数超过了数组长度的一半,那么可以很顺利的找到这个元素,实现见"编程练习:寻找发帖水王" 扩展 上面的问题中,强调了某 ...

  6. Java面试题(上)

    2013年年底的时候,我看到了网上流传的一个叫做<Java面试题大全>的东西,认真的阅读了以后发现里面的很多题目是重复且没有价值的题目,还有不少的参考答案也是错误的,于是我花了半个月时间对 ...

  7. HTML5<canvas>标签:使用canvas元素在网页上绘制四分之一圆(3)

    前几天自己做了个四分之一的圆,放到手机里面测试.效果不是很好.于是今天通过查资料,找到了canvas.自己研究了一天,发现可以使用canvas画圆.代码如下: <!doctype html> ...

  8. ASP.NET页面之间传值QueryString(1)

    QueryString是一种非常简单的传值方式,他可以将传送的值显示在浏览器的地址栏中.如果是传递一个或多个安全性要求不高或是结构简单的数值时,可以使用这个方法.但是对于传递数组或对象的话,就不能用这 ...

  9. SNMP OID Reference - NetScaler 10

    SNMP OID Reference - NetScaler 10 https://docs.citrix.com/content/dam/docs/en-us/netscaler/10/downlo ...

  10. 2018-2-6考试（COCI2014/2015 Contest#5）

    T1:FUNGHI(1s,32M,50pts)得分:50 题意:给你8个数组成一个环,要你求出其中连续的4个数,让它们的和最大 题解:暴力求出每一连续4个数之和,比较一下就好 标签:模拟 C++ Co ...