NPM 与 CNPM

网上的 npm 教程主要都在讲怎么安装、配置和使用 npm ，却很少告诉新人「npm 是干什么的？」「为什么要使用 npm？」。今天我就来讲讲这个话题。本文目标读者是「不太了解 npm 的新人」，老司机请绕道。

---

社区

程序员自古以来就有社区文化。社区的意思是：拥有共同职业或兴趣的人们，自发组织在一起，通过分享信息和资源进行合作。虚拟社区的参与者经常会在线讨论相关话题，或访问某些网站。 前端程序员也有社区，世界上最大的前端社区应该就是 GitHub 了。前端通过 GitHub 来分享源代码（线上代码仓库），讨论问题（Issue 列表），收集学习资源和常去的网站（比如我收集的优质中文前端博客）。加入社区最大的好处之一是，你可以使用别人贡献的代码，你也可以贡献代码给别人用。

---

共享代码

前端是怎么共享代码的呢？在 GitHub 还没有兴起的年代，前端是通过网址来共享代码。比如你想使用 jQuery ，那么你点击 jQuery 网站上提供的链接就可以下 jQuery ，放到自己的网站上使用 。GItHub 兴起之后，社区中也有人使用 GitHub 的下载功能。

---

麻烦

当一个项目依赖的代码越来越多，程序员发现这是一件很麻烦的事情：
1.去 jQuery 官网下载 jQuery
2.去 BootStrap 官网下载 BootStrap
3.去 Underscore 官网下载 Underscore
......
有些程序员就受不鸟了，一个拥有三大美德的程序员 Isaac Z. Schlueter （以下简称 Isaaz）给出了一个解决方案：用一个工具把这些代码集中到一起来管理吧！这个工具就是他用 JavaScript （运行在 Node.js 上）写的 npm，全称是 Node Package Manager。

npm的思路大概是这样的：
1.买个服务器作为代码仓库（repository），在里面放所有需要被共享的代码
2.发邮件通知 jQuery 、Bootstrap 、Underscore 的作者使用 npm publish 把代码提交到 repository 上，分别取名 jquery、bootstrap 和 underscore（注意大小写）
3.社区里的其他人如果想使用这些代码，就把 jquery、bootstrap 和 underscore 写到 package.json 里，然后运行 npm install ，npm 就会帮他们下载代码
4.下载完的代码出现在 node_modules 目录里，就可以随意使用了。

这些可以被使用的代码被叫做「包」（package），这就是 npm名字的由来：Node Package(包) Manager(管理器)。

---

发展

Isaaz 通知 jQuery 作者 John Resig，他会答应吗？这事儿不一定啊，对不对。只有社区里的人都觉得 「npm 是个宝」的时候，John Resig 才会考虑使用 npm。

那么 npm 是怎么火的呢？
npm 的发展是跟 node.js 的发展相辅相成的。node.js 是由一个在德国工作的美国程序员 Ryan Dahl 写的。他写了 node.js，但是 node.js 缺少一个包管理器，于是他和npm的作者一拍即合、抱团取暖，最终 node.js 内置了 npm。

后来的事情大家都知道，node.js 火了。随着 node.js 的火爆，大家开始用 npm 来共享 JS 代码了，于是 jQuery 作者也将 jQuery 发布到 了 npm 上。所以现在，你可以使用 npm install jquery 来下载 jQuery 代码了。现在用 npm 来分享代码已经成了前端的标配。

---

后续

node.js 目前由 Ryan Dahl 当时所在的公司 joyent 继续开发。Ryan Dahl 现在已经去研究 AI 和机器学习了，并且他把 node.js 的维护权交给了 Isaaz。而 Isaaz 维护了一段时间后，辞职了，成立了一个公司专门维护 npm 的 repository，公司名叫做 npm 股份有限公司......谁说开源不能赚钱的呀？？？

---

社区的力量

回顾前端的发展史你会发现，一般都是社区里的某个人，发布了一份代码，最终影响前端接下来几年的走向。比如 jQuery，比如 node.js，比如 npm，其实其它语言也是这样的，所以说，社区的力量是巨大的。

前端的标配：npm是什么及其安装（含cnpm）

        </h1>
        <div class="clear"></div>
        <div class="postBody">

 

前端的标配：npm是什么及其安装

一：npm是什么及其来源

参考来源：npm是干什么的

总结：不需要去相关的网站下载依赖，用一个工具把这些依赖集中起来管理

 

 

NPM 的思路大概是这样的：

 

1）买个服务器作为代码仓库（registry），在里面放所有需要被共享的代码

 

2）发邮件通知 jQuery、Bootstrap、Underscore 作者使用 npm publish 把代码提交到 registry 上，分别取名 jquery、bootstrap 和 underscore（注意大小写）

 

3）社区里的其他人如果想使用这些代码，就把 jquery、bootstrap 和 underscore 写到 package.json 里，然后运行 npm install ，npm 就会帮他们下载代码

 

4）下载完的代码出现在 node_modules 目录里，可以随意使用了。

这些可以被使用的代码被叫做「包」（package），这就是 NPM 名字的由来：Node Package(包) Manager(管理器)。

 

二：下载及安装

下载地址：　　https://nodejs.org/en/download/

下载后一路 next 记得换自己想保存的路径即可~

安装完成后，通过

npm -v

查看版本即可

 

三：修改npm配置

新建两个文件夹

 

我们来更改默认的全局下载目录（C:\Users\Administrator\AppData\Roaming\npm\node_modules）避免C盘变大

打开配置

npm config list

设置 prefix 即全局路径

npm config set prefix "路径"

查看全局路径

npm config get prefix

cache同理，注意修改下命令

 

四：npm i 和npm install的区别

1）用npm i安装的模块没办法使用npm uninstall删除，必须使用npm uninstall i才能卸载掉
2）npm i会帮助检测与当前node版本最匹配的npm包版本号，并匹配出相互依赖的npm包应该提升的版本号
3）部分npm包在当前node版本下无法使用，必须使用建议版本
4）安装报错时intall会出现npm-debug.log 文件，npm i不一定会出现
5）npm install能生成package.lock.json文件，而npm i不能

建议使用npm install命令

 五：安装cnpm

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

cnpm -v

不慌!!!!,配置下环境变量

在path里面丢下 F:\develop\miscellaneous\nodejs\npm\node_global（刚才的全局路径即可）

 

 

 六：npm与cnpm

npm

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

npm命令

• npm -v 来测试是否成功安装
• 查看当前目录已安装插件：npm list
• 更新全部插件： npm update [ --save-dev ]
• 使用 npm 更新对应插件： npm update <name> [ -g ] [ --save-dev]
• 使用 npm 卸载插件： npm uninstall <name> [ -g ] [ --save-dev ]

cnpm

• 淘宝团队做的国内镜像，因为npm的服务器位于国外可能会影响安装。淘宝镜像与官方同步频率目前为 10分钟 一次以保证尽量与官方服务同步。
• 安装：命令提示符执行
  npm install cnpm -g --registry=https://registry.npm.taobao.org
• cnpm -v 来测试是否成功安装

通过改变地址来使用淘宝镜像

• npm的默认地址是https://registry.npmjs.org/
• 可以使用npm config get registry查看npm的仓库地址
• 可以使用npm config set registry https://registry.npm.taobao.org来改变默认下载地址，达到可以不安装cnpm就能采用淘宝镜像的目的，然后使用上面的get命令查看是否成功。

nrm

• nrm包安装命令： npm i nrm -g
• nrm能够管理所用可用的镜像源地址以及当前所使用的镜像源地址，但是只是单纯的提供了几个url并能够让我们在这几个地址之间方便切换
• nrm ls即nrm list，查看所有可用的镜像，并可以切换。*号表示当前npm使用的地址，可以使用命令nrm use taobao或 nrm use npm来进行两者之间的切换。
  
  

  nrm ls命令

-g -S -D

• -g：全局安装。 将会安装在C：\ Users \ Administrator \ AppData \ Roaming \ npm，并且写入系统环境变量；非全局安装：将会安装在当前定位目录;全局安装可以通过命令行任何地方调用它，本地安装将安装在定位目录的node_modules文件夹下，通过要求调用;
• -S：即npm install module_name --save,写入package.json的dependencies ,dependencies 是需要发布到生产环境的，比如jq，vue全家桶，ele-ui等ui框架这些项目运行时必须使用到的插件就需要放到dependencies
• -D：即npm install module_name --save-dev,写入package.json的devDependencies ,devDependencies 里面的插件只用于开发环境，不用于生产环境。比如一些babel编译功能的插件、webpack打包插件就是开发时候的需要，真正程序打包跑起来并不需要的一些插件。

为什么要保存在package.json 因为node_module包实在是太大了。用一个配置文件保存，只打包安装对应配置文件的插件，按需导入。

希望我的文章能够帮助到你！