express 4.x+ swig
Express 是一個基於 Node.js 平臺的極簡、靈活的 web 應用開發框架，它提供一系列強大的特性，幫助你建立各類 Web 和移動設備應用。
express官網：http://www.expressjs.com.cn/javascript
經過應用生成器工具 express 能夠快速建立一個應用的骨架。css
經過以下命令安裝：html
$ npm install express-generator -g
-h 選項能夠列出全部可用的命令行選項：java
$ 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 的應用。node
$ 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
而後安裝全部依賴包：git
$ cd myapp $ npm install
啓動這個應用（MacOS 或 Linux 平臺）：github
$ DEBUG=myapp npm start
Windows 平臺使用以下命令：web
> SET DEBUG=myapp:* & npm start
而後在瀏覽器中打開 http://localhost:3000/ 網址就能夠看到這個應用了。iexpress
經過 Express 應用生成器建立的應用通常都有以下目錄結構：npm
.
├── 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
而後$ npm install express-generator -g
而後在瀏覽器中打開 http://localhost:3000/ 網址就能夠看到這個應用了。
swig 是node端的一個優秀簡潔的模板引擎，相似Python模板引擎Jinja，目前不只在node端較爲通用，相對於jade、ejs優秀，並且在瀏覽器端也能夠很好地運行。
這是官方文檔。
安裝swig
1 $ npm install swig --save
在express中使用swig
在express框架中，默認的模版是jade，更改成swig模版引擎。
修改packge.json
1 "jade": "~1.11.0",改成1 "swig": "^1.4.2",
1 { 2 "name": "myapp", 3 "version": "0.0.0", 4 "private": true, 5 "scripts": { 6 "start": "node ./bin/www" 7 }, 8 "dependencies": { 9 "body-parser": "~1.17.1", 10 "cookie-parser": "~1.4.3", 11 "debug": "~2.6.3", 12 "express": "~4.15.2", 13 "morgan": "~1.8.1", 14 "serve-favicon": "~2.4.2", 15 "swig": "^1.4.2" 16 } 17 }
修改app.js
1 var app = express(); 2 app.set('view engine', 'jade'); 3 // 把上面的代碼改成下面的 4 // view engine setup 5 var app = express(); 6 var swig = require('swig'); 7 app.engine('html', swig.renderFile); //使用swig渲染html文件 8 app.set('view engine', 'html'); //設置默認頁面擴展名 9 app.set('view cache', false); //設置模板編譯無緩存 10 app.set('views', path.join(__dirname, 'views')); //設置項目的頁面文件，也就是html文件的位置 11 swig.setDefaults({cache: false}); //關閉swig模板緩存 12 swig.setDefaults({loader: swig.loaders.fs(__dirname + '/views')}); //從文件載入模板，請寫絕對路徑，不要使用相對路徑
而後把原來的views文件夾下得文件後綴都改成html
模板文件layout.html
1 <!doctype html> 2 <html> 3 <head> 4 <meta charset="utf-8"> 5 <title>{% block title %}{% endblock %}</title> 6 {% block head %} 7 {% endblock %} 8 </head> 9 <body> 10 {% block content %}{% endblock %} 11 </body> 12 </html>
index.html
1 {% extends 'layout.html' %} 2 3 {% block title %}index {{title}} {%endblock%} 4 5 {% block head %} 6 {{title}} 7 {% endblock %} 8 9 {% block content %} 10 <p>This is just an awesome page.</p> 11 {% endblock %}
而後再路由中設置便可使用：
routes\index.js
1 router.get('/', function(req, res, next) { 2 res.render('index', { title: '標題' }); 3 });
以後我在命令行裏執行 $ 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