博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
Nodejs 手动搭建 Express 项目
阅读量:7060 次
发布时间:2019-06-28

本文共 2245 字,大约阅读时间需要 7 分钟。

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

安装全局模块

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

浏览器访问 成功输出

图片描述

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

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: 第一次写文章,请多加指教。

转载地址:http://mifll.baihongyu.com/

你可能感兴趣的文章
方法中(+),(-)的区分
查看>>
Django学习(五) 定义视图以及页面模板
查看>>
关于pycharm中导入自己写的模块没有智能提示的解决办法
查看>>
【转载】K-means聚类算法
查看>>
debian系统下安装ssh
查看>>
C++内联函数、函数模板之于头文件
查看>>
MAVEN学习笔记之基础(1)
查看>>
input type=file 怎么样调取用户手机照相机
查看>>
iOS LaunchImage快速设置
查看>>
海量数据面试题----分而治之/hash映射 + hash统计 + 堆/快速/归并排序
查看>>
左神算法进阶班4_1画出楼的轮廓
查看>>
力扣算法题—072编辑距离
查看>>
MySQL(数据库)
查看>>
gulp在webstorm里运行,告别cmd控制台!
查看>>
BIG biang教你误删oracle 怎么办,
查看>>
1.1 面试问题整理
查看>>
像素PX厘米转换
查看>>
Activity_liftCycle — 生命周期
查看>>
一种效率比较高的分页存储过程
查看>>
多线程面试
查看>>