node.js require模板报错_前端开发：如何搭建及操作nodejs？

大好，我来了，本期为大家带来的Web前端知识是”前端开发：如何搭建及操作nodejs？“，对前端开发有兴趣的小伙伴，和我一起来看看吧！

主要内容

1. Nodejs介绍
2. 环境搭建
3. Node基础
4. 基本的命令行操作
5. Commonjs规范
6. Express安装
7. 路由配置

学习目标

一、Nodejs介绍

1.1 Nodejs是什么

简单的说 Node.js 就是运行在服务端的 JavaScript。

Node 是一个让 JavaScript 运行在服务端的开发平台，它让 JavaScript 成为与PHP、Python、Perl、Ruby 等服务端语言平起平坐的脚本语言。 发布于2009年5月，由Ryan Dahl开发，实质是对Chrome V8引擎进行了封装。

Javascript的速度非常快，性能非常好。

Node是技术还是语言？

总结：

我们现在不在使用ajax,对后期项目的支持，大概2天时间，我们现在不是ajax请求，不在使用php,我们现在使用node去模拟数据，后面我们使用node模拟数据。

前后端同时开发，后台会给你数据吗? 我们一定要学会模拟数据

Node的使用做后台不如java文档 但是他读数据快速，

1.2 Nodejs安装

中文网：http://nodejs.cn/

Node.js 安装包及源码下载地址为：https://nodejs.org/en/download/

Node.js 历史版本下载地址：https://nodejs.org/dist/

1.2.1 Windows 安装包(.msi)

32 位安装包下载地址 : https://nodejs.org/dist/v4.4.3/node-v4.4.3-x86.msi

64 位安装包下载地址 : https://nodejs.org/dist/v4.4.3/node-v4.4.3-x64.msi

本文实例以 v0.10.26 版本为例，其他版本类似， 安装步骤：

步骤 1 : 双击下载后的安装包 v0.10.26，如下所示：

步骤 2 : 点击以上的Run(运行)，将出现如下界面：

步骤 3 : 勾选接受协议选项，点击 next（下一步） 按钮 :

步骤 4 : Node.js默认安装目录为 "C:Program Filesnodejs" , 你可以修改目录，并点击 next（下一步）：

步骤 5 : 点击树形图标来选择你需要的安装模式 , 然后点击下一步 next（下一步）

步骤 6 :点击 Install（安装） 开始安装Node.js。你也可以点击 Back（返回）来修改先前的配置。 然后并点击 next（下一步）：

安装过程：

点击 Finish（完成）按钮退出安装向导。

检测PATH环境变量是否配置了Node.js

点击开始=》运行=》输入"cmd" => 输入命令"path"，输出如下结果：

PATH

我们可以看到环境变量中已经包含了C:Program Filesnodejs

检查Node.js版本

1.2.2 Mac OS 上安装

你可以通过以下两种方式在 Mac OS 上来安装 node：

1、在官方下载网站下载 pkg 安装包，直接点击安装即可。

2、使用 brew 命令来安装：

brew 

1.3体验nodejs

demo.js

【代码演示】

const 

启动命令行：

$ node demo.js

页面输入：

http

1.4 命令行常用操作

Node的文件仍然是js文件，但是运行需要在node环境运行：node filename.js

控制台：

1. 打开控制台

开始->搜索框中输入运行->cmd 回车

Win+R ->输入cmd

在当前路径下打开：在目录下，右键->在此处打开命令行

2. 进入盘

盘名称:

3. 进入目录

cd 目录/目录

4. 返回上一级目录

cd .. cd ../

5. 自动补全

Tab按键

6. 创建文件夹

mkdir 文件夹名称

7. 清空控制台

cls

8. 查看当前文件夹下的所有文件

dir

9. 删除文件和文件夹

rd 名字

10. 历史记录

上下按键调整历史记录

11。 运行node 文件

node 文件名称

12. ctrl+c 退出运行状态

本章作业

1. 怎么运行nodejs文件
2. 控制台常见的命令操作

第二节 Node基础

2.1 Node体验本地服务

创建一个02demo.js

【代码演示】

//引入本地服务 http服务

返回数据格式

String buffer

【代码演示】

var 

.

//乱码

2.2 Nodejs的Commonjs规范

在nodejs中 文件与文件之间是互相不能随意访问的

所以，node提供了commonjs规范 用来规范文件与文件之前的关系

【代码演示】

data

【代码演示】

data.js

//导出

Index.js

//导入

我们看到文件之前都是独立的作用域,我们之前为了隔离创建一个自执行函数，commonjs方便我们使用

2.3 Nodejs提供querystring库

【代码演示】

//querystring 转化参数格式

Url库

consolog

2.4 安装cnpm代理

npm是node提供的包管理工具，因为服务器咋国外，所以速度很慢，代理下载速度慢

NPM是随同NodeJS一起安装的包管理工具，能解决NodeJS代码部署上的很多问题，常见的使用场景有以下几种：

• 允许用户从NPM服务器下载别人编写的第三方包到本地使用。
• 允许用户从NPM服务器下载并安装别人编写的命令行程序到本地使用。
• 允许用户将自己编写的包或命令行程序上传到NPM服务器供别人使用。

由于新版的nodejs已经集成了npm，所以之前npm也一并安装好了。同样可以通过输入 "npm -v" 来测试是否成功安装。命令如下，出现版本提示表示安装成功:

cnpm是淘宝镜像，服务器在国内，下砸速度快

检测npm版本：npm -v

安装cnpm

安装完毕检测成功与失败：

输入cnpm 主要不打印：”不是内部或者外部命令，也不是可运行的程序或批处理文件”说明成功了

本章作业

1. node体验本地服务 浏览器输出：”hello world”
2. commonjs实现文件之前的访问
3. 数据的json和字符串的转换
4. cnpm安装

第三节Express

3.1 express 安装

基于 Node.js 平台，快速、开放、极简的 Web 开发框架

官网：http://www.expressjs.com.cn/

3.1.1快速入门--安装

1. 通过 npm init 命令为你的应用创建一个 package.json 文件

npm 

2. 安装 Express 并将其保存到依赖列表中

npm 

3.1.2 Package.json 属性说明

name - 包名。

version - 包的版本号。

description - 包的描述。

homepage - 包的官网 url 。

author - 包的作者姓名。

contributors - 包的其他贡献者姓名。

dependencies - 依赖包列表。如果依赖包没有安装，npm 会自动将依赖包安装在 node_module 目录下。

repository - 包代码存放的地方的类型，可以是 git 或 svn，git 可在 Github 上。

main - main 字段指定了程序的主入口文件，require('moduleName') 就会加载这个文件。这个字段的默认值是模块根目录下面的 index.js。

keywords - 关键字

注意：不能下载node_module文件 文件资料很大，需要自己cnpm下载

3. 安装完毕--进入hello world

【index.js代码演示】

4. 代码赋值到index.js node运行index.js

5. 浏览器中运行 localhost:3000

3.2 postMan 与路由

3.2.1 路由

Respond with Hello World! on the homepage:

app

Respond to POST request on the root route (/), the application’s home page:

app

Respond to a PUT request to the /user route:

app

Respond to a DELETE request to the /user route:

app

【get代码演示】

步骤：新建项目文件

npm init(可以省略)

cnpm install express --save

运行index.js

浏览器打开 运行

//路由配置

【post请求】

【其他请求方式】

3.2.2 安装postMan

1.打开某某工具

2.打开chrome商店 进入网上应用店

3.搜索postMan 点击添加

4.单击进入下载 postMan 安装后打开使用

5.选择请求的方式 输入对应的请求地址

具体步骤

1. 打开工具连接
2. chrome商店 chrome/app:

3.

4.安装后

6. 点开postman

3.2.3 请求本地json数据

【代码演示】

//路由配置

json数据 data.js

module

效果

3.3 静态文件

为了提供诸如图像、CSS 文件和 JavaScript 文件之类的静态文件，请使用 Express 中的 express.static 内置中间件函数

步骤

1. 静态资源路径

public

images

2.使用静态资源

此函数特征如下：

express

例如，通过如下代码就可以将 public 目录下的图片、CSS 文件、JavaScript 文件对外开放访问了：

app

现在，你就可以访问 public 目录中的所有文件了：

http

Express 在静态目录查找文件，因此，存放静态文件的目录名不会出现在 URL 中。

如果要使用多个静态资源目录，请多次调用 express.static 中间件函数：

一个参数

app

两个参数

app

现在，你就可以通过带有 /static 前缀地址来访问 public 目录中的文件了。 根目录

http

本章作业

1. express安装
2. 路由配合请求
3. 静态资源请求

四、路由和接口参数处理

4.1 路由应用

var 

【路由模块】

index.js使用路由

【路由根目录】

浏览器访问：http://localhost:3000/api/student

4.2路由访问本地data数据

4.3接口参数处理

4.3.1 get接受参数

getParamas

4.3.2 post接受参数

var 

本章作业

1. 路由模块定义

2. 接口参数get/post

本期的前端知识”前端开发：如何搭建及操作nodejs？“到此结束了，对前端开发有兴趣的小伙伴关注我，更多内容等你来看，我们下期再见！