Node.js使用Express创建Web项目详细教程


Posted in Javascript onMarch 31, 2017

序:如果你还不知道Node.js是什么,那么你可以先看看这篇:Node.js 究竟是什么?或者任何关于它的介绍。

一、安装Node.js

1.进入Node.js官网下载并安装

Node.js使用Express创建Web项目详细教程

2.启动cmd输入命令查看node及npm版本

node -vnpm -v

Node.js使用Express创建Web项目详细教程

npm是node完成安装后自带的包管理器

二、安装Express

express是node平台下最常用的web应用开发框架

1.全局安装express

npm install -g express

Win7环境全局安装在C:\Users\Administrator\AppData\Roaming\npm\node_modules文件夹下

2.全局安装express命令行工具

npm install -g express-generator

在最新的4.x版本中,命令行工具已经被独立出来

3.查看express版本

express -V

Node.js使用Express创建Web项目详细教程 

4.更新已安装的express

npm update -g express

三、使用Express创建项目

1.创建项目

express APP_NAME

express默认以jade作为模板引擎,模板文件为.jade类型;jade的语法与html有较大差异,对缩进也是要求严格的

Node.js使用Express创建Web项目详细教程

2.以ejs作为模板引擎创建项目

express APP_NAME -e

在项目名称的后面添加 -e 那么创建出来的模板文件就是.ejs类型,语法是与html相同的

Node.js使用Express创建Web项目详细教程

3.将ejs文件改为html

若希望模板文件的后缀为.html(通常只是为了看着更舒服),那么在手动将.ejs换成.html后,还需要对app.js文件进行设置

var ejs = require('ejs');

app.engine('.html', ejs.__express);
app.set('view engine', 'html');  //app.set('view engine', 'ejs');

原文件:

Node.js使用Express创建Web项目详细教程

修改后:

Node.js使用Express创建Web项目详细教程

4.安装依赖包

进入项目文件夹,执行:

npm install

下载package.json中记录的所有依赖包到node_modules文件夹

注意:更多npm命令,请查看npm常用命令集合

四、启动服务

1.启动

npm start

监听bin/www文件,默认端口为3000,可在www文件中更改

Node.js使用Express创建Web项目详细教程

2.打开浏览器,输入localhost:3000

Node.js使用Express创建Web项目详细教程

3.自动重启服务

打开package.json可以看见,监听bin/www文件的命令是node

Node.js使用Express创建Web项目详细教程

使用node监听将会导致:每次修改代码后,需要手动重启服务,可以使用nodemon进行自动重启

npm install -g nodemon

同样可以使用下面的命令查看其版本

nodemon -v

将package.json文件中的代码修改为:

"start": "nodemon ./bin/www"

重新执行:

npm start

Node.js使用Express创建Web项目详细教程

接下来,就可以随心所欲的编码了...

Javascript 相关文章推荐
javascript笔记 String类replace函数的一些事
Sep 22 Javascript
浅析JavaScript声明变量
Dec 21 Javascript
纯JS实现可拖拽表单的简单实例
Sep 02 Javascript
遍历json获得数据的几种方法小结
Jan 21 Javascript
利用Mongoose让JSON数据直接插入或更新到MongoDB
May 03 Javascript
浅谈 vue 中的 watcher
Dec 04 Javascript
解决bootstrap中下拉菜单点击后不关闭的问题
Aug 10 Javascript
vuejs前后端数据交互之从后端请求数据的实例
Aug 11 Javascript
JavaScript的Proxy可以做哪些有意思的事儿
Jun 15 Javascript
基于Express框架使用POST传递Form数据
Aug 10 Javascript
vue单应用在ios系统中实现微信分享功能操作
Sep 07 Javascript
原生JS实现音乐播放器
Jan 26 Javascript
ES6使用let命令更简单的实现块级作用域实例分析
Mar 31 #Javascript
JS解决移动web开发手机输入框弹出的问题
Mar 31 #Javascript
详解使用JS如何制作简单的ASCII图与单极图
Mar 31 #Javascript
Angularjs中使用指令绑定点击事件的方法
Mar 30 #Javascript
Angualrjs和bootstrap相结合实现数据表格table
Mar 30 #Javascript
微信小程序中顶部导航栏的实现代码
Mar 30 #Javascript
ES6中Proxy与Reflect实现重载(overload)的方法
Mar 30 #Javascript
You might like
《魔兽争霸3》重制版究竟重制了什么?玩家:这么糊弄真的好吗?
2020/05/04 魔兽争霸
php简单统计在线人数的方法
2016/05/10 PHP
php生成与读取excel文件
2016/10/14 PHP
jquery 获取json数据实现代码
2009/04/27 Javascript
jquery 检测元素是否存在的实例代码
2013/11/19 Javascript
Jquery实现控件的隐藏和显示实例
2014/02/08 Javascript
Node.js中使用Buffer编码、解码二进制数据详解
2014/08/16 Javascript
jQuery中end()方法用法实例
2015/01/08 Javascript
Javascript 拖拽雏形中的一些问题(逐行分析代码,让你轻松了拖拽的原理)
2015/01/23 Javascript
JS实现自适应高度表单文本框的方法
2015/02/25 Javascript
JQuery+Ajax实现数据查询、排序和分页功能
2015/09/27 Javascript
js自调用匿名函数的三种写法(推荐)
2016/08/19 Javascript
D3.js封装文本实现自动换行和旋转平移等功能
2016/10/14 Javascript
jstree创建无限分级树的方法【基于ajax动态创建子节点】
2016/10/25 Javascript
jquery日历插件e-calendar升级版
2016/11/10 Javascript
常用的几个JQuery代码片段
2017/03/13 Javascript
Vue.js常用指令的使用小结
2017/06/23 Javascript
详谈javascript精度问题与调整
2017/07/08 Javascript
利用npm 安装删除模块的方法
2018/05/15 Javascript
vue服务端渲染操作简单入门实例分析
2019/08/28 Javascript
javascript设计模式 ? 适配器模式原理与应用实例分析
2020/04/13 Javascript
[19:26]TNC vs EG (BO3)
2018/06/07 DOTA
Python的Tornado框架实现图片上传及图片大小修改功能
2016/06/30 Python
Django自定义分页与bootstrap分页结合
2021/02/22 Python
对python3新增的byte类型详解
2018/12/04 Python
win7下 python3.6 安装opencv 和 opencv-contrib-python解决 cv2.xfeatures2d.SIFT_create() 的问题
2019/10/24 Python
python中pyqtgraph知识点总结
2021/01/26 Python
GLAMGLOW格莱魅美国官网:美国知名的面膜品牌
2016/12/31 全球购物
介绍java中初始化块的使用
2012/09/11 面试题
迎国庆演讲稿
2014/09/15 职场文书
学生违纪检讨书200字
2014/10/21 职场文书
学习作风建设心得体会
2014/10/22 职场文书
保送生自荐信范文
2015/03/26 职场文书
预备党员群众意见
2015/06/01 职场文书
2015年女工委工作总结
2015/07/27 职场文书
2019数学教师下学期工作总结
2019/06/27 职场文书