NodeJS的安装与配置

1、nodejs的安装

①、nodejs的简介

Node.js 是 Javascript 的运行环境(Runtime)，发布于2009年5月，它是能让 JavaScript 程序运行在服务端的一个开发平台，类似于后端的服务器，让项目运行在服务器上，然后通过浏览器访问（例如：localhost:8080）。它让 JavaScript 成为与Java，PHP、Python等服务端语言平起平坐的脚本语言。

②、npm 的简介

npm 是 node.js 的包管理器，npm全称为：node package manager，它已经整合在node.js中，我们可以理解它为后端的Maven工具，它能够帮助前端进行项目的构建和管理。

工具	作用	仓库	镜像
npm	管理前端系统依赖	远程仓库(中央仓库)	淘宝镜像
maven	管理java后端依赖	远程仓库(中央仓库)	阿里云镜像

Vue 工程需要建立在node.js 的基础上。如果要使用Vue，那么安装NodeJS是基础，NodeJS的安装非常的简，以下是NodeJS的安装步骤教：

node.js官方网址：https://nodejs.org/zh-cn/ 这里选择下载稳定版本，下载哪个版本完全取决于自己。

1、双击刚刚下载的安装包。

2、点击Next，开始安装。

3、勾选协议，然后点击Next。

4、更改nodejs的安装路径，这里直接将C:\Program Files\nodejs改为D:\NodeJS，然后点击Next。

5、自定义设置这里不用进行选择，默认就好，继续点击Next。

6、不勾选安装工具，继续点击Next。

7、点击Install开始进行安装。

8、等待安装完成。

9、安装完成，点击Finish关闭，至此Nodejs就安装完毕了。

10、最后验证 nodejs 和 npm 包管理器是否安装成功，打开cmd控制台，输入cmd，然后依次输入如下两个命令：

• node -v：查看nodejs的版本号。
• npm -v：查看npm的版本号。

出现如上提示则表明安装成功了。

2、nodejs的相关配置

其实只要上面Nodejs的安装完成就可以使用了，但是本人对于软件的安装有强迫症，就是与系统无关的软件绝对不会安装在C盘，而npm安装的全局模块和缓存默认会放在C盘，所以需要修改这两个文件的存储路径，操作如下：

• 默认模块安装路径：C:\Users\{你的用户名}\AppData\Roaming\npm
• 默认缓存路径均：C:\Users\{你的用户名}\AppData\Local\npm-cache

2.1、修改模块安装路径和缓存路径

①、首先打开 cmd 控制台，使用如下两个命令来查看当前使用的路径。

• npm config get prefix：查看npm下载的模块存储路径
• npm config get cache：查看缓存存储路径

②、然后找到你的 node.js 安装路径，新建一个文件夹 node_cache。

③、接着在 cmd 控制台中输⼊如下两个命令：

npm config set prefix "D:\NodeJS"

作用：设置模块存放根路径（相当于Maven的本地仓库），从远程仓库下载的模块都会存放在该路径下。这里设置为NodeJS的安装路径，因为在安装node.js时会自动给我们创建一个node_modules文件夹(默认存放npm)，而我们在第一次使用npm命令下载模块的时候，也会在指定的目录创建一个node_modules文件夹用于存储模块，我们使其重合在一起，所以说我们的模块实际是存放在D:\NodeJS\node_modules下的。

npm config set cache "D:\NodeJS\node_cache"

作用：设置缓存存放路径，就是你刚刚创建的node_cache文件，将缓存存放至该文件。

④、最后继续使用npm config get prefix和npm config get cache命令查看是否配置成功。

可以发现配置成功了。

2.2、配置系统环境变量

按照上面的这种方式不需要配置环境变量

因为上面实际的模块存放路径是在D:\Nodejs\node_modules下，而模块的命令存放在D:\Nodejs\下。当我们在安装Nodejs时，系统会默认给我们配置了一个环境变量，变量值为：D:\Nodejs\，而我们的命令恰好在这个目录下，所以不需要再配置系统环境变量了。

注：配置环境变量的目的是可以全局访问到命令。

右击此电脑-->点击属性-->高级系统设置-->环境变量-->编辑系统变量-->找到Path双击

3、npm设置国内镜像

在上面也介绍了npm和maven一样是有中央仓库的，众所周知，国内直接使用 npm 的官方镜像是非常慢的，所以这里推荐使用淘宝 npm 镜像。

npm config set registry https://registry.npm.taobao.org

设置完成之后使用下面命令查看：

npm config get registry

输入如下命令显示所有配置信息：

npm config list

注意：上面配置的配置信息都会保存在本地，存放路径：C:\Users\{用户名}\.npmrc

如果要卸载NodeJS则必须删除该文件，否则下次模块和缓存的路径还是这个。

4、npm安装vue.js和vue脚手架

4.1、npm安装vue.js

npm install -g vue   ##下载vue.js
npm uninstall -g vue   ##卸载vue.js

注意：一定要加上-g，这是全局安装的意思，如果不加是局部安装，会安装在cmd控制台当前运行的目录下

4.2、npm安装vue脚手架(vue-cli)

vue-cli：用于生成Vue工程模板。（它可以帮你快速开始一个vue的项目，也就是给你一套vue的结构，包含基础的依赖库）。vue-cli工具还内置了模板包括 webpack 和 webpack-simple

①、下载vue-cli

npm install -g vue-cli  ##安装2.x版本的脚手架
npm install -g @vue/cli  ##安装3.x版本的脚手架

注意：2.x和3.x版本的脚手架只能安装安装一个，否则会冲突。

②、卸载vue-cli

npm uninstall -g vue-cli  ##卸载2.x版本的脚手架
npm uninstall -g @vue/cli  ##卸载3.x版本的脚手架

③、更新脚手架

npm update -g @vue/cli

④、验证是否安装成功

vue -V

注：后面的V是大写的