npm(你怕吗) 全局安装与本地安装、开发依赖和生产依赖

npm（你怕吗）

npm(Node Package Manager)是 JavaScript 世界的包管理工具,而且是 Node.js 平台的默认包管理工具。经过 npm 能够安装、共享、分发代码,管理项目依赖关系。（与其有一样功能的另外一个包管理工具yarn，速度用体验比旧版本的npm好，但npm最近的新版本也作出很大努力，与yarn速度和体验差距愈来愈小，有兴趣能够了解下）。

npm这几年能够说是前端猿平常离不开的工具了，刚开始学习使用node、npm来进行前端项目构建的时候，有不少概念须要理解，各类命令行、各类新js语法、各类环境依赖...就问你怕吗？：

讲真，刚开学时我怕。废话很少扯，如今咱们进入主题，聊聊npm 全局安装与本地安装、开发依赖和生产依赖，先抛几个常见疑惑：

1. 什么是全局安装、什么是本地安装(或叫局部安装，下文统一叫本地安装) ？
2. 为何要全局安装？为何又要本地安装？全局安装和本地安装有什么区别？
3. 什么叫开发依赖、生产依赖？什么又是开发环境、生产环境？

全局安装与本地安装

1、全局安装：

npm install <pageName> -g//（这里-g是-global的简写）

经过上面的命令行（带-g修饰符）安装某个包，就叫全局安装。一般全局包安装在node目录下的node_modules文件夹。能够经过执行下面几条命令查看node、npm的安装目录和全局包的安装目录。

which node   // 查看node的安装目录
which npm   // 查看npm的安装目录
npm root -g // 查看全局包的安装目录
npm list -g --depth 0 //查看全局安装过的包

2、本地安装:

npm install <pageName> (后面能够加几种修饰符，主要有两种--save-dev和--save)

经过上面的命令行安装某个包，就叫本地安装。包安装在你当前项目文件夹下的node_modules文件夹中。

3、全局安装的做用:

全局安装的包可提供直接执行的命令(例：gulp -h能够查看gulp定义了什么命令)。 好比gulp全局安装后，能够在命令行上直接执行gulp -v、gulp -h等（原理：全局安装的gulp会将其package.json中的bin命令注入到了全局环境，使得你能够全局执行：gulp xxx命令，这另外一个话题了，不深刻）。假若只在本地安装了gulp，未在全局安装gulp，直接执行这些命令会报错。你想要执行相应的命令则可能须要例如：node ./node_modules/gulp/bin/gulp.js -v(查看版本) 这样用一大串命令来执行。所以全局安装就发挥到他的好处了，一个gulp -v就搞定

固然，不是每一个包都必需要全局安装的，通常在项目中须要用到该包定义的命令才须要全局安装。好比gulp <taskName>执行gulp任务...等，因此是否须要全局安装取决于咱们如何使用这个包。全局安装的就像全局变量有点粗糙，但在某些状况下也是必要的，全局包很重要，但若是不须要，最好避免使用。

4、能够全局安装，那么直接全局安装处处使用就好了，干吗还须要本地安装？

1. 若是只是全局安装了而没本地安装，就得require('<pagePath>') 例：引入一个全局的包可能就是requirt('/usr/local/....')经过全局包的路径引入，这样显然十分的不灵活。若是安装了本地包，那么就能够直接require('<pageName>')引入使用。
2. 一个包一般会在不一样的项目上会重复用到，若是只全局安装，那么当某个项目须要该包更新版本时，更新后可能就会影响到其余一样引用该包的项目，所以本地安装能够更灵活地在不一样的项目使用不一样版本的包，并避免全局包污染的问题，

一个经验法则：要用到该包的命令执行任务的就须要全局安装，要经过require引入使用的就须要本地安装（ 但实际开发过程当中，咱们也不怎么须要考虑某个包是全局安装仍是本地安装，由于这一点在该包的官网上通常会明确指出，以上是为了理解全局安装和本地安装）

开发依赖和生产依赖

顺着上面讲到的本地安装，本地安装有两种主要的安装方式：

1. 保存到开发依赖(devDependencies): npm install <pageName> --save-dev
2. 保存到生产依赖(dependencies): npm install <pageName> --save

"开发依赖"顾名思义在开发环境中用到的依赖，"生产依赖"在生产环境中用到的依赖。那么这里又延伸出个问题什么是开发环境、什么是生产环境？

1、开发环境和生产环境

【开发环境】：指的是你的项目尚且在编码阶段时的环境。你在代码可能还有各类console.log()、注释、格式化等。
【生产环境】：指的是你的项目已经完成编码，并发布上线可供用户浏览的阶段时的环境。代码可能通过了压缩、优化等处理。

这些概念其实并无一个很明确的定义，接下来咱们举例个场景，将"开发环境"、"生产环境"和上面的"开发依赖"、"生产依赖"联系起来就会比较容易理解的了。假如咱们在开发过程当中使用jQuery。在以往，可能就是把jQuery这个插件下载的本地，再通<script>引入html中。但这有个不方便的地方，咱们每次进行一个项目的时候就得手动复制这个jQuery文件到咱们的项目中，若是想要换个版本又得官网上下载、随着项目愈来愈多。用到的插件、库也随之越繁杂...这样会形成自家用的插件管理繁琐的问题。所以就出现了npm(包管理工具)你须要用到什么，直接经过一条命令行就能够将想要的插件下载下来，并直接引入到项目中，目前几乎全部的js插件都能在npm上直接下载。

2、生产依赖

回到环境和依赖话题，咱们下载的jQuery，在开发时参与源码编写，在发布上线的生产环境中也是须要它的。不只在开发环境编写代码时要依赖它、线上环境也要依赖它，所以将它归类为"生产依赖"，安装时执行npm install jquery --save，它就会被记录在package.json的dependencies。当进行代码打包时，会将这里的jQuery打包入咱们的项目代码中。

3、开发依赖

接着，假如咱们用gulp对html进行压缩，咱们一般会用到一个插件gulp-htmlmin。咱们只但愿它把html压缩完就ok了，并不但愿它融入咱们的项目代码中，即只存在于开发环境，所以把他归类为"开发依赖"。安装时执行npm install gulp-htmlmin --save-dev它就会被记录在package.json的devependencies下，当进行代码打包时，不会将这里的gulp-htmlmin插件源码打包入咱们的项目代码中

devDependencies只会在开发环境下使用，生产环境不会被打入包内；而dependencies不只在开发环境中要使用，生产环境也须要使用到。根据以上规则，咱们就很容易区分哪些插件是用--save-dev模式安装，哪些用--save模式安装。

最后

文章开头的问题以上已经一一回答了。刚开始时本身也会有不少相似这样的疑问，哪怕已经使用npm的各类包构建过很多项目，对这些概念仍是会有点模糊，使用固然是会使用的，但没有一个比较清晰的总结。全部花了点时间，到各社区、node、npm官网搜集关于以上问题的一些答案、简单作个笔记和总结。 毕竟总结并记录下来的东西才是本身的。也但愿能够帮助有一样疑问的朋友，如发现文章有不对的地方望指出，谢谢