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 相关文章推荐
JQuery 学习笔记 选择器之三
Jul 23 Javascript
JQuery.ajax传递中文参数的解决方法 推荐
Mar 28 Javascript
jquery随意添加移除html的实现代码
Jun 21 Javascript
javascript 回到顶部效果的实现代码
Feb 17 Javascript
判断访客终端类型集锦
Jun 05 Javascript
js实现图片无缝滚动
Dec 23 Javascript
JavaScript+html5 canvas制作的百花齐放效果完整实例
Jan 26 Javascript
jQuery网页定位导航特效实现方法
Dec 19 Javascript
JS中offset和匀速动画详解
Feb 06 Javascript
纯JS实现五子棋游戏
May 28 Javascript
vue接通后端api以及部署到服务器操作
Aug 13 Javascript
多种类型jQuery网页验证码插件代码实例
Jan 09 jQuery
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
在PHP中PDO解决中文乱码问题的一些补充
2010/09/06 PHP
深入理解PHP中的Streams工具
2015/07/03 PHP
Yii框架日志记录Logging操作示例
2018/07/12 PHP
FLASH 广告之外的链接
2008/12/16 Javascript
纯CSS打造的导航菜单(附jquery版)
2010/08/07 Javascript
AngularJS入门教程(零):引导程序
2014/12/06 Javascript
ECMAScript中函数function类型
2015/06/03 Javascript
JavaScript合并两个数组并去除重复项的方法
2015/06/13 Javascript
全系IE支持Bootstrap的解决方法
2015/10/19 Javascript
在localStorage中存储对象数组并读取的方法
2016/09/24 Javascript
jQuery实现的购物车物品数量加减功能代码
2016/11/16 Javascript
Vue.js组件tree实现省市多级联动
2016/12/02 Javascript
基于js中style.width与offsetWidth的区别(详解)
2017/11/12 Javascript
关于Vue单页面骨架屏实践记录
2017/12/13 Javascript
微信小程序实现图片压缩功能
2018/01/26 Javascript
jQuery实现导航样式布局操作示例【可自定义样式布局】
2018/07/24 jQuery
理解JavaScript中的对象
2020/08/25 Javascript
[00:32]2018DOTA2亚洲邀请赛出场——VP
2018/04/04 DOTA
[02:10]探秘浦东源深体育馆 DOTA2 Supermajor不见不散
2018/05/17 DOTA
python实现的希尔排序算法实例
2015/07/01 Python
python机器学习库常用汇总
2017/11/15 Python
Python中支持向量机SVM的使用方法详解
2017/12/26 Python
Window环境下Scrapy开发环境搭建
2018/11/18 Python
python3.6 如何将list存入txt后再读出list的方法
2019/07/02 Python
韩国三星集团旗下时尚品牌官网:SSF SHOP
2016/08/02 全球购物
Oakley官网:运动太阳镜、雪镜和服装
2016/09/30 全球购物
秋季红领巾广播稿
2014/01/27 职场文书
旅游饭店管理专业自荐书
2014/06/28 职场文书
军人离婚协议书样本
2014/10/21 职场文书
2014年人大工作总结
2014/12/10 职场文书
学生会个人总结范文
2015/02/15 职场文书
宾馆前台接待岗位职责
2015/04/02 职场文书
村级干部党员公开承诺事项
2015/05/04 职场文书
教师正风肃纪心得体会
2016/01/15 职场文书
用Python简陋模拟n阶魔方
2021/04/17 Python
Windows7下FTP搭建图文教程
2022/08/05 Servers