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静态的动态
Sep 18 Javascript
前端开发必须知道的JS之原型和继承
Jul 06 Javascript
jQuery Mobile页面跳转后未加载外部JS原因分析及解决
Mar 18 Javascript
js替换字符串的所有示例代码
Jul 23 Javascript
javascript中interval与setTimeOut的区别示例介绍
Mar 14 Javascript
谈谈JavaScript中的几种借用方法
Aug 09 Javascript
浅谈js中字符和数组一些基本算法题
Aug 15 Javascript
JQuery Dialog对话框 不能通过Esc关闭的原因分析及解决办法
Jan 18 Javascript
canvas实现粒子时钟效果
Feb 06 Javascript
Vue.js弹出模态框组件开发的示例代码
Jul 26 Javascript
JS获取本地地址及天气的方法实例小结
May 10 Javascript
vue.js购物车添加商品组件的方法
Sep 17 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 静态变量的初始化
2009/11/15 PHP
PHP 验证码的实现代码
2011/07/17 PHP
php环境配置之CGI、FastCGI、PHP-CGI、PHP-FPM、Spawn-FCGI比较?
2011/10/17 PHP
mac下安装nginx和php
2013/11/04 PHP
PHP微信分享开发详解
2017/01/14 PHP
PHP中include和require的区别实例分析
2017/05/07 PHP
js的一些常用方法小结
2011/06/29 Javascript
jQuery.clean使用方法及思路分析
2013/01/07 Javascript
js的Boolean对象初始值示例
2014/03/04 Javascript
使用FlexiGrid实现Extjs表格效果方法分享
2014/12/16 Javascript
详解JavaScript中循环控制语句的用法
2015/06/03 Javascript
浅析C/C++,Java,PHP,JavaScript,Json数组、对象赋值时最后一个元素后面是否可以带逗号
2016/03/22 Javascript
js创建jsonArray传输至后台及后台全面解析
2016/04/11 Javascript
JS中parseInt()和map()用法分析
2016/12/16 Javascript
获取IE浏览器Cookie信息的方法
2017/01/23 Javascript
VUE页面中加载外部HTML的示例代码
2017/09/20 Javascript
原生JS实现小小的音乐播放器
2017/10/16 Javascript
详解Angular模板引用变量及其作用域
2018/11/23 Javascript
如何写好一个vue组件,老夫的一年经验全在这了(推荐)
2019/05/18 Javascript
vue实现弹幕功能
2019/10/25 Javascript
微信小程序实现发微博功能的示例代码
2020/06/24 Javascript
在Python中使用__slots__方法的详细教程
2015/04/28 Python
用matplotlib画等高线图详解
2017/12/14 Python
Jupyter notebook远程访问服务器的方法
2018/05/24 Python
python实现一个简单RPC框架的示例
2020/10/28 Python
python list等分并从等分的子集中随机选取一个数
2020/11/16 Python
诗狄娜化妆品官方网站:Stila Cosmetics
2016/12/21 全球购物
施华洛世奇意大利官网:SWAROVSKI意大利
2018/07/23 全球购物
盖尔斯工厂店:GUESS Factory
2020/01/21 全球购物
一道Delphi上机题
2012/06/04 面试题
30年同学聚会感言
2014/01/30 职场文书
销售人员自我评价
2014/02/01 职场文书
募捐感谢信
2015/01/22 职场文书
python操作xlsx格式文件并读取
2021/06/02 Python
教你使用TensorFlow2识别验证码
2021/06/11 Python
Flink 侧流输出源码示例解析
2022/09/23 Servers