Node.js环境搭建及简单demo

白茶等風 發表於 2020-7-14 18:47:00

<h2>Node.js：最简单的Web服务器</h2>
 
<h2>1，下载并安装node</h2>
　　官网下载：https://nodejs.org/en/download/
　　我的版本
     <img src="https://img2020.cnblogs.com/blog/856014/202007/856014-20200714160929910-372899486.png">
 　　安装完后，在cmd中检查是否安装成功，如下图：
      <img src="https://img2020.cnblogs.com/blog/856014/202007/856014-20200714161034528-364232744.png">
       输入：node -v 表示node.js已安装成功并显示版本号
       输入：npm -v 表示自带的npm也安装成功并显示版本号
 
　　说明：新版的Node.js已自带npm，安装Node.js时会一起安装，
　　　　   npm的作用就是对Node.js依赖的包进行管理，
　　　　   也可以理解为用来安装/卸载Node.js需要装的东西
 
　　备注：
　　1.npm：安装依赖包从国外下载，速度较慢（node自带）
　　2.cnpm：需要手动安装，从国内下载，速度较快
　　　　cnpm 相对 npm 速度快
　　　　cnpm 跟npm 用法完全一致，只是在执行命令时将npm改为cnpm。
　　3.Git工具：git bash 是 Windows 下的命令行工具。
　　
　　所以：下面第二步骤，根据各自需求，可以装也可以不装
 
 
<h2>2，选装cnpm和Git工具</h2>
<h3>     2.1，选装cnpm</h3>
　　安装完node后，在cmd命令行中输入：
　　npm install -g cnpm --registry=http://registry.npm.taobao.org
 
　　如下，安装进度示意图，一直等待，直到完成显示 
      <img src="https://img2020.cnblogs.com/blog/856014/202007/856014-20200714161244499-2018468130.png">
　　加载完后，如上图：cnpm安装完毕
     
 
<h3>　2.2，选装Git工具</h3>
 　　官网下载：https://gitforwindows.org/
　　我的版本：
 　<img src="https://img2020.cnblogs.com/blog/856014/202007/856014-20200714162217191-424329909.png">
 　　
　　安装成功后，桌面会有Git的快捷方式，鼠标右键会显示相应的Git信息
       <img src="https://img2020.cnblogs.com/blog/856014/202007/856014-20200714162329739-1368813010.png">
 
　　安装完Git后，双击桌面的"Git Bash"，即可输入cnpm或者npm下载资源
       <img src="https://img2020.cnblogs.com/blog/856014/202007/856014-20200714163857937-1936696360.png">
       <img src="https://img2020.cnblogs.com/blog/856014/202007/856014-20200714163930187-303774707.png">
      <img src="https://img2020.cnblogs.com/blog/856014/202007/856014-20200714163947979-48161605.png">
 
  
<h2>3，生成依赖包管理文件和安装依赖包</h2>
<h3>　　3.1. 生成依赖包管理文件</h3>
　　　　生成依赖包管理文件：package.json
 
　　第一、新建文件夹
　　　　要求：不能有中文（即下文中的目标文件夹）
　　
　　第二、如何定位到目标文件夹
　　1. 选中文件夹路径
 　　<img src="https://img2020.cnblogs.com/blog/856014/202007/856014-20200714171015265-1700549990.png">
 
<h4>　　2，输入cmd回车</h4>
 　　<img src="https://img2020.cnblogs.com/blog/856014/202007/856014-20200714171053906-1618649859.png">
 
<h4>　　c，弹出cmd的对话框，即定位到当前文件夹</h4>
　　<img src="https://img2020.cnblogs.com/blog/856014/202007/856014-20200714171110089-1409077082.png">
 
 
　　第三、生成依赖包管理文件
 
　　a,  定位到目标文件夹，输入：npm init -y
            -y：表示一直yes
 　　<img src="https://img2020.cnblogs.com/blog/856014/202007/856014-20200714171849031-718971778.png">
 　
    　b，安装完成后，显示如下图信息：
　　<img src="https://img2020.cnblogs.com/blog/856014/202007/856014-20200714171955261-371523.png">
 
　　c，目标文件夹中生成相关文件：package.json
　　<img src="https://img2020.cnblogs.com/blog/856014/202007/856014-20200714172036072-1191157822.png">
 
　　到此依赖文件生成完成
 
 
<h3>　　3.2.  安装依赖包</h3>
　　安装依赖包：定位到目标文件夹
　　命令行中输入：npm install express -S
　　　　或者输入：cnpm install express -S
　　两者选一个，因为cnpm速度快，根据需求自己选择
　　-S：表示保存到package.json(即安装完成后，会修改package.json文件)
　　<img src="https://img2020.cnblogs.com/blog/856014/202007/856014-20200714172227707-607302406.png">
 　　<img src="https://img2020.cnblogs.com/blog/856014/202007/856014-20200714172247391-455377610.png">
 
　　如上图，表示依赖包下载完成，
　　并且目标文件夹中会生成文件夹： node_modules
　　到此安装依赖包完成
 　　<img src="https://img2020.cnblogs.com/blog/856014/202007/856014-20200714172331338-2027343752.png">
 
 
<h2>4，创建node服务文件</h2>
　　在目标文件夹中，创建空的js文件
　　<img src="https://img2020.cnblogs.com/blog/856014/202007/856014-20200714172437851-472196750.png">
　　具体内容如下：（编写一个简单的接口）
　　<img src="https://img2020.cnblogs.com/blog/856014/202007/856014-20200714172521259-1063298257.png">
　　server-run.js 是一个简单的 demo 服务器
 
 
<h2>5，启动服务</h2>
　　用步骤4中创建的js文件（server-run.js），进行本地启动web服务 
 
<h3 align="left">　　5.1. 通过cmd启动服务</h3>
 　　cmd启动服务，定位到目标文件夹
　　输入：node + 空格 + 服务文件名.js
 
　　<img src="https://img2020.cnblogs.com/blog/856014/202007/856014-20200714183624801-1329994764.png">
 
 
　　如上图，服务已正常启动
 
 
<h3 align="left">　　5.2. 服务中的接口测试</h3>
<h4>　　5.2.1 用浏览器测试</h4>
　　如下图，测试成功，浏览器中的页面，正常显示服务器中的信息
 　　<img src="https://img2020.cnblogs.com/blog/856014/202007/856014-20200714183758035-242399130.png">
 
 
 　　<img src="https://img2020.cnblogs.com/blog/856014/202007/856014-20200714183808019-1410894042.png">
 
<h4>　　5.2.2 用postman工具测试</h4>
　　 <img src="https://img2020.cnblogs.com/blog/856014/202007/856014-20200714184008523-926141279.png">
 
<h3 align="left">　　5.3. 通过Git工具启动服务</h3>
　　　　相对于cmd的另一种启动服务器的方式
 
　　a、定位到目标文件夹中，点击右键选择：Git Bash Here 
　　<img src="https://img2020.cnblogs.com/blog/856014/202007/856014-20200714184255714-1746142471.png">
 
　　b、启动服务，输入：node + 空格 + 服务文件名.js
　　<img src="https://img2020.cnblogs.com/blog/856014/202007/856014-20200714184418153-2012038104.png">
 
　　到此，通过Git工具服务，启动成功
 
 
 
 
<h3 align="left">　　5.4. 停止服务</h3>
　　　　Ctrl+C：停止当前服务
   
来源：https://www.cnblogs.com/ggll611928/p/13300272.html

頁: [1]

琼殿技术论坛's Archiver

Node.js环境搭建及简单demo