Nodejs 手动搭建 Express 项目

2019-11-08 03:10:57

字体：大中小

来源：转载

供稿：网友

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

安装全局模块

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模块的一个公共属性，表示要渲染的文件扩展名。

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

![node app.js][1]

浏览器访问 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'); //设置模板引擎为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: 第一次写文章，请多多指教。

上一篇：.net面试题整理

下一篇：eclipse配置tomcat图文详解