俗话说好记性不如烂笔头,在看了两天文档后,在这里准备把自己学到的东西写成文章记录下来。
安装全局模块
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'); //设置模板引擎为ejsapp.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'); //修改模板文件的后缀名为htmlapp.engine('.html' , ejs.__express); //"__express",ejs模块的一个公共属性,表示要渲染的文件扩展名。
接下来在控制台跑起来看看
浏览器访问 成功输出
到这里项目就已经初步搭建起来了。
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'); //设置模板引擎为ejsapp.set('view engine' , 'html'); //设置模板引擎为htmlapp.engine('.html' , ejs.__express);app.use( express.static(path.join(__dirname, 'public')) ); // 配置静态资源目录app.listen(port);console.log('server started at port ' + port);
ps: 第一次写文章,请多加指教。