node.js安装配置以及npm和cnpm的使用

Posted 2021-04-25 前端你我他

一、安装Node 

关于软件

   Node.js是前端开发必备的运行环境。软件尽量选比较新的版本。进入官网：https://nodejs.org/en/，选择稳定的版本,点击下载。

Node.js向导安装步骤

 

点击Next

 

勾选同意条款并点击Next

 

设置安装位置为：d:\node\nodejs\   

点击Next

 

保持默认的安装选项，点击Next

 

点击安装，耐心等待一会儿，看到下面的界面，安装成功！

 

点击完成，已经安装完成了，是不是很容易啊，下面我们再检验一下是否安装成功。

安装完成后，win + R，打开运行窗口，输入cmd，调出命令行窗口，运行令：

node –v    查看node版本

npm –v     查看npm版本

 

这里happyLee用的是v6.10.2版本，node版本不一样，相应的npm也不一样

能正确显示版本信息就表示，我们的工具已经可以使用了。

那npm是啥呢？它是Node Package Manager的缩写，叫做node包管理工具。我们用它来安装我们的node模块（或者叫node包）。因为nodejs安装后，它本身提供的功能是比较有限的。但它的模块化管理方式，允许我们安装新的node模块来不断扩展功能。而安装和卸载工作就交给了npm来管理。

 

在node在安装的过程中，已经自动的进行了Path环境变量的设置，以确保我们的node和npm命令可用，所以我们不需要在进行环境配置。

如果有同学对此感兴趣，那我们就带着好奇心，我们看下node安装的背后进行了怎么的设置吧。

查看window系统的环境变量

 

先来看系统变量下的Path（看清楚是系统变量，不是用户变量）

 

双击系统变量Path

 

win10用户直接添加即可

 

看到node安装后会自动在系统Path最后加上nodejs的安装目录，这样的话，我们在nodejs安装目录下的两个命令node和npm就可以直接在cmd命令行中直接使用了。

再来看下用户变量Path

双击用户变量Path

 

看到node安装后也会自动在Path变量上附加一个这样的路径。该路径指向的是使用npm命令安装的工具存放的位置。随后会介绍用npm怎么安装一些常用的工具。这些工具对应的命令可以直接在cmd命令行中使用，是和这里Path指定的工具安装的目录有关系的，了解即可。

 

 

用npm安装bower工具

先简单介绍下，bower是一个前端js类库管理工具，它负责下载我们需要的js类库并能很好的维护类库间的依赖关系。具体用法会在后面介绍。

 

要安装bower，在cmd命令行窗口运行以下命令：

npm install bower -g --registry=https:\\registry.npm.taobao.org

 

上面指令的意思是，在全局范围内安装bower工具。用-g来表示全局范围安装，这样就会安装到前面我们讲到的用户目录下的npm路径：C:\Users\Administrator\AppData\Roaming\npm；最后--registry表明指定国内镜像，解决下载时的网络问题。

 

安装完成，我们来验证下bower工具是否可用，输入命令：

bower –v    查看bower版本信息

看到正确输出了bower的版本信息，OK！

 

并且我们看到工具装在这个位置

需要注意下，npm安装工具时，涉及到两个目录，除了上面用来存放工具的npm目录，和npm同级的还有一个npm-cache目录，用来存放工具安装时的缓存文件。

 

现在我们来考虑这样一个问题：一般我们的系统盘（C盘）的空间就有限，安装太多的node工具后，我们的系统盘越来越下了，能不能把这两个目录移到别的盘去呢？答案是肯定的！npm允许我们自己配置这两个目录的，那咱们开始吧！

 

首先我们用npm工具把先前安装的bower模块卸载掉吧。运行：

npm uninstall –g bower

 创建新的npm和npm-cache目录

在d:\node路径下新建两个目录，和nodejs的安装目录nodejs位于同一级

打开cmd命令行窗口，分别运行以下三个命令

npm config set prefix="D:\node\npm"

npm config set cache="D:\node\npm-cache"

npm config ls

 

前两个命令用于设置，第三个命令用于查看设置信息

 

重新设置npm安装包的路径到用户环境变量Path中

Path: D:\node\npm

 最后，不要忘了将原先的用户目录下的npm和npm-cache目录删除。

 

现在你是不是迫不及待想要验证下安装node包会不会放到我们设置的目录下去呢？

OK！现在我们就来安装一个新的node包叫cnpm！我们将用它取代npm！因为用它下载东西快啊！因为cnpm在下载安装包需要的资源时用的是国内代理。当然如果你的工作环境足够OK，也可以忽略此过程，不过为了以防万一，还是请耐心看下去吧。

 

重新打开一个新的cmd命令行窗口，运行：

npm install cnpm -g --registry=https:\\registry.npm.taobao.org

上面的截图省略了黄色高亮输出的模块依赖树的大部分内容。检查下我们新设置的npm包存放目录

 

Perfect！完美！

 那么怎么使用cnpm来安装node包呢？用法和npm类似，比如要安装bower，

也因为新安装了cnpm，新开一个cmd命令行窗口，运行：

cnpm i -g bower

上面的i是install的简写。 

当然卸载指令还是用npm uninstall -g bower哈。

（此教程属于个人整理，如有错误，欢迎批评指正，我定当会虚心接受，您的关注，就是我持续的动力！）