Nodejs 手动搭建 Express 项目

俗话说好记性不如烂笔头，在看了两天文档后，在这里准备把本身学到的东西写成文章记录下来。

安装全局模块

npm install -g express express-generator suptervisor 

// express-generator  Express 应用生成器
// suptervisor  监视你对代码的改动，并自动重启 Node.js ,必须全局安装

快速生成项目

express -e blog   // -e 使用ejs 模板引擎生成项目

手动建立项目

1.安装依赖

npm init 
npm install express ejs --save

// 项目结构

blog
├─app.js        // 入口文件
├─package.json  // 项目依赖配置
├─node_modules  // 存放项目的依赖库
├─public        // 静态文件资源目录
│  ├─images
│  ├─js
│  └─styles
└─views         // 视图文件（ejs模板 或jade 模板）

2.编写入口文件

// 引用模块
var express = require('express');
var path = require('path');
var ejs = require('ejs');
var app = express();

app.set('views', path.join(__dirname,'views'));  // 设置视图文件目录

app.set('view engine' , 'ejs'); //设置模板引擎为ejs

app.use( express.static(path.join(__dirname, 'public')) );  // 配置静态资源目录


// 路由规则
app.get('/', function(request, response){
    response.send('Hello Node.js')
});

app.listen(3000);    // 监听 3000 端口

console.log('server started at port 3000');

3.修改模板后缀

默认ejs模板只支持渲染以ejs为扩展名的文件，可能在使用的时候会以为它的代码书写方式很不爽仍是想用html的形式去书写。
在这里可使用engine 注册模板引擎的函数，让他处理指定后缀名的文件

/*
* 将上面的 app.set('view engine' , 'ejs')
* 修改为
* */

app.set('view engine' , 'html'); //修改模板文件的后缀名为html
app.engine('.html' , ejs.__express);   //"__express"，ejs模块的一个公共属性，表示要渲染的文件扩展名。

接下来在控制台跑起来看看

浏览器访问 http://localhost:3000 成功输出

到这里项目就已经初步搭建起来了。

4.路由模块化

在根目录新建routes 文件夹

// routes/index.js  

var express = require('express');
var router = express.Router();   //使用 express.Router 类建立模块化、可挂载的路由句柄

// 访问根路由 渲染 index 模板
router.get('/', function (req, res) {
    res.render('index');
});

module.exports = router;

添加模板, 在views文件夹下新建 index.html 模板 （就一普通html文件）

修改入口文件app.js

// 引入 路由模块
var router = require('./routes/index');
app.use('/', router);

将写在app.js 中的路由删掉。

到这里整个项目已经搭建起来了，大功告成。

//app.js

// 引用模块
var express = require('express');
var path = require('path');
var ejs = require('ejs');
var app = express();
var port = process.env.PORT || 3000;
// 引入 路由模块
var router = require('./routes/index');
app.use('/', router);
// 设置视图文件目录
app.set('views', path.join(__dirname,'views'));  

// app.set('view engine' , 'ejs'); //设置模板引擎为ejs
app.set('view engine' , 'html'); //设置模板引擎为html
app.engine('.html' , ejs.__express);

app.use( express.static(path.join(__dirname, 'public')) );  // 配置静态资源目录
app.listen(port);
console.log('server started at port ' + port);

ps: 第一次写文章，请多加指教。