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 相关文章推荐
扩展easyui.datagrid,添加数据loading遮罩效果代码
Nov 02 Javascript
jQuery循环滚动展示代码 可应用到文字和图片上
May 11 Javascript
js实现一个省市区三级联动选择框代码分享
Mar 06 Javascript
JS获取时间的方法
Jan 21 Javascript
js操作数组函数实例小结
Dec 10 Javascript
Node.js设置CORS跨域请求中多域名白名单的方法
Mar 28 Javascript
详解angularJs中关于ng-class的三种使用方式说明
Jun 02 Javascript
vue组件学习教程
Sep 09 Javascript
ReactNative之FlatList的具体使用方法
Nov 29 Javascript
javascript trie前缀树的示例
Jan 29 Javascript
js实现消灭星星(web简易版)
Mar 24 Javascript
vue cli4下环境变量和模式示例详解
Apr 09 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
深入PHP中的HashTable结构详解
2013/06/13 PHP
PHP连接数据库实现注册页面的增删改查操作
2016/03/27 PHP
PHP中功能强大却很少使用的函数实例小结
2016/11/10 PHP
PHP实现的迪科斯彻(Dijkstra)最短路径算法实例
2017/09/16 PHP
Html中JS脚本执行顺序简单举例说明
2010/06/19 Javascript
通过jquery的$.getJSON做一个跨域ajax请求试验
2011/05/03 Javascript
JS弹出窗口代码大全(详细整理)
2012/12/21 Javascript
深入了解JavaScript中的Symbol的使用方法
2015/07/28 Javascript
12种JavaScript常用的MVC框架比较分析
2015/11/16 Javascript
js实现网页收藏功能
2015/12/17 Javascript
js导出excel文件的简洁方法(推荐)
2016/11/02 Javascript
JavaScript判断浏览器对CSS3属性是否支持的多种方法
2016/11/13 Javascript
JS实现汉字与Unicode码相互转换的方法详解
2017/04/28 Javascript
JS设计模式之数据访问对象模式的实例讲解
2017/09/30 Javascript
浅谈Koa服务限流方法实践
2017/10/23 Javascript
webpack+vue2构建vue项目骨架的方法
2018/01/09 Javascript
vue.js过滤器+ajax实现事件监听及后台php数据交互实例
2018/05/22 Javascript
浅谈React碰到v-if
2018/11/04 Javascript
使用VUE实现在table中文字信息超过5个隐藏鼠标移到时弹窗显示全部
2019/09/16 Javascript
[08:47]DOTA2每周TOP10 精彩击杀集锦vol.6
2014/06/25 DOTA
Python实现子类调用父类的方法
2014/11/10 Python
Python测试网络连通性示例【基于ping】
2018/08/03 Python
用Python爬取QQ音乐评论并制成词云图的实例
2019/08/24 Python
python+selenium定时爬取丁香园的新型冠状病毒数据并制作出类似的地图(部署到云服务器)
2020/02/09 Python
基于python的docx模块处理word和WPS的docx格式文件方式
2020/02/13 Python
判断Threading.start新线程是否执行完毕的实例
2020/05/02 Python
如何用Python和JS实现的Web SSH工具
2021/02/23 Python
台湾母婴用品购物网站:Infant婴之房
2018/06/15 全球购物
意大利巧克力店:Chocolate Shop
2019/07/24 全球购物
土耳其新趋势女装购物网站:Addax
2020/01/07 全球购物
资源工程专业毕业生求职信
2014/02/27 职场文书
校庆筹备方案
2014/03/30 职场文书
机械工程及其自动化专业求职信
2014/08/08 职场文书
2015年大学生入党自荐书
2015/03/24 职场文书
关爱留守儿童主题班会
2015/08/13 职场文书
团队拓展训练心得体会
2016/01/12 职场文书