（笔记整理）web开发工具(node npm Bower webpack)使用介绍-npm（3）

参考路径：
一 .npm
https://www.npmjs.com/ 第三方包搜索
https://www.cnblogs.com/john-sr/p/6036652.html
https://www.npmjs.cn/getting-started/what-is-npm/
https://www.runoob.com/nodejs/nodejs-npm.html NPM 使用介绍

初识npm

一、npm简介：
npm全称为Node Package Manager，是一个基于Node.js的包管理器，也是整个Node.js社区最流行、支持的第三方模块最多的包管理器。

npm的初衷：JavaScript开发人员更容易分享和重用代码。

npm的使用场景：

允许用户获取第三方包并使用。
允许用户将自己编写的包或命令行程序进行发布分享。

npm版本查询：npm -v

npm安装：

1、安装nodejs

由于新版的nodejs已经集成了npm，所以可直接通过输入npm -v来测试是否成功安装。

2、使用npm命令来升级npm: npm install npm -g
　　
二、npm的工作原理：
1、包和模块：
什么是包(package)?
包是描述一个文件或一个目录。
一个包的配置通常由以下构成：
一个文件夹包含一个package.json配置文件。
包含（含有package.json文件的文件夹）的Ｇzip压缩文件。
解析gzip的url为注册表添加@的url 信息注意的是即使你从来没有在注册中心发布你的公共包,你可能仍然可以得到很多所有这些package, 使用npm的好处:
如果你只是计划想写增加一个节点或/。
如果你安装它也希望在其他地方分成一个tarball后进行包装
Git url的形式:
　git:/ /github.com/user/project.git # commit-ish
　git + ssh:/ / user@hostname:project.git # commit-ish
　git +http://user@hostname项目/ blah.git # commit-ish
　git +https://user@hostname项目/ blah.git # commit-ish
　可以捡出commit-ish的一个git任何标签和master分支、安全哈希算法。
　2.什么是模块（module）?

模板是通过配置文件中的一个dom节点进行包含一个或多个包。通常一般由包和配置文件以及相关模块程序构成完成一个或多个业务功能操作。

一个模块可以在node . js 程序中装满任何的require()任何。 以下是所有事物加载模块的例子 :

一个文件夹package.json文件包含一个main字段。
一个文件夹index.js文件。
一个JavaScript文件。

3.npm的包和模块的关系：
　一般来说在js程序中使用require加载它们的模块在节点中进行配置npm包，一个模块不一定是一个包。
　例如,一些cli包, js程序节点中只包含一个可执行的 命令行界面,不提供main字段。 那么这些包不是模块。
　几乎所有npm包(至少,那些节点计划)包含许多模块在他们(因为每个文件加载require()是一个模块)。
　几乎所有的npm包都关联着多个模块，因为每个文件都使用require()加载一个模块。
　从module加载文件中的上下文node节点。如：var req = require(‘request’)。我们可能会说,“request模块赋值给req这个变量”。

4.npm的生态系统：
　　　　　　package.json文件定义的是包。
　　　　　　node_modules文件夹是存储模块的地方。便于js查找模块
　例如：
　　　如果创建一个node_modules/foo.js文件，通过var f=require(‘foo.js’)进行加载模块。因为它没有package.json文件所以foo.js不是一个包。 （包里面要包含package.json文件）
　　如果没有创建index.js包或者package.json文件"main"字段,即使是在安装node_modules,因为它没有require()所以它不是一个模块。
　　（模块里要有 index.js包，或者package.json 的"main"字段）
2.npm2的依赖分析：

https://www.cnblogs.com/john-sr/p/6036652.html

npm2和npm3的不同点：
　　关键的主要区别是:

在目录结构中的位置不再预测类型 (主要的,次要的等)的依赖
依赖分析取决于安装顺序将会改变node_modules目录树状结构
　　npm2:按照一个嵌套方式进行安装所有依赖项。

npm3:试图减轻树的深度和冗余的嵌套。 尝试通过安装一些次要的依赖关系在一个平面,需要它作为主要的相同的目录中依赖。
　　
　　假设：我们需要一个模块Ａ依赖模块Ｂ。
　　
　　现在,让我们创建一个应用程序,该应用程序依赖模块Ａ。

npm v2这将发生在一个嵌套的方式。
　　
　　假设我们想依赖另一个模块C . C依赖B另一个版本。
　　
然而,由于模块B v1.0已经是顶级dep,我们不能安装模块B v2.0顶级依赖。 npm v3通过违约处理 npm v2行为和嵌套新的,不同的,模块B版本 依赖的模块,需要它——在这种情况下,模块C。

列表的依赖关系,还能看到他们的关系npm ls:
如果你想看看你的主要依赖关系,可以使用:　npm ls -深度= 0

4.npm3的复制和删除重复数据：

目前我们有一个应用程序 这依赖于两个模块:

模块Ａ依赖于模块Ｂv1.0
模块C依赖于模块Bv2.0

最后,让我们也更新模块E v2.0,也取决于模块B v2.0代替模块B v1.0,就像模块Ａ更新。

npm3执行以下事情:

它删除模块E v1.0
它安装模块版本
它删除模块B v1.0因为什么依赖于它
因为没有模块B其他版本，所以它安装模块B v2.0的顶级目录

。。。

我们在几乎每一个模块B v2.0目录。 去掉重复,我们可以运行:　npm dedupe

这个命令解析所有的包依赖模块B版本 重定向到顶层模块B v2.0并删除所有副本 嵌套的副本。
　　
记住:安装顺序很重要。

我们的安装顺序：

npm安装时首先开始着手项目,所有模块中列出的包。json已经安装在node_modules文件夹。

然后模块版本更新安装。

它们的变化：

因为此前,模块Ａ v1.0，模块B v1.0,模块E v1.0,模块Ｃ v1.0,模块D v1.0和模块E v1.0是顶级依赖，

随后根据模块的版本更新，模块B没有其他版本可以继续占据顶级依赖的位置就成为模块Ａ新版本的新依赖。

由于没有建立node_modules目录，我们通过package.json脚本的配置进行安装依赖关系运行后这个项目会建立一个新目录。

通过package.json的配置更新模块Ａ v2.0，按照字母的先后顺序进行npm的安装命令执行，

所以不是最后一次执行。

然后，

因为此前已有node_modules目录，在更新模块,首先安装的是模块Ａ v2.0，其次是模块Ｂ v2.0，模块B v2.0迭代模块Ｂ v1.0成为顶级依赖。最后执行模块E v1.0时由于模块B v1.0不存在顶级依赖，但有模块Ｂ v1.0这个模块所以模块Ｂ v1.0无耐地嵌套在模块E v1.0下。

不同的依赖关系树结构不会影响我们的应用

即使依赖关系树的不同，我们都能满足所有依赖项指向对应的被依赖项进行安装对应的模块版本，它们都有各自的配置。

我们应怎么做才能保证node_modules目录是一样的？

我们使用npm安装命令进行安装,使用package.json,总是会建立相同的树。这是因为按照package.json的配置进行按字母顺序进行安装。相同的安装顺序意味着你会得到相同的树。

你可以在移除node_modules目录并运行npm package.json进行配置你所需要的互相依赖关系树。

三、npm相关常识：

package.json文件配置目录：

npm全称为Node Package Manager，是一个基于Node.js的包管理器，也是整个Node.js社区最流行、支持的第三方模块最多的包管理器。

dependencies 项目依赖

项目依赖： dependencies
开发依赖：devDependencies

ode环境下：node_modules里面的文件
package.json来制定名单，需要哪些npm包来参与到项目中来，npm install命令根据这个配置文件增减来管理本地的安装包。

dependencies(项目依赖库):在安装时使用–save则写入到dependencies
和devDependencies（开发依赖库）：在安装时使用–save-dev将写入到devDependencies

node_modules文件里的依赖全部安装：npm install
node_modules文件里的依赖只安装dependencies：npm install --production
node_modules文件里的依赖只安装devDependencies：npm install packagename --dev

例：安装vant依赖：
node使用npm install vant –save 更新到dependencies下；生产环境必须。
node使用npm install vant –save -dev 更新到devDependencies下；用于开发阶段。

1. devDependencies和dependencies的区别：
devDependencies里面的插件只用于开发环境，不用于生产环境，即辅助作用，打包的时候需要，打包完成就不需要了。
而dependencies是需要发布到生产环境的，自始至终都在。
比如wepack等只是在开发中使用的包就写入到devDependencies，而像vue这种项目全程依赖的包要写入到devDependencies。

2. file-loader和url-loader的区别：
以图片为例，file-loader可对图片进行压缩，但是还是通过文件路径进行引入，当http请求增多时会降低页面性能，而url-loader通过设定limit参数，小于limit字节的图片会被转成base64的文件，大于limit字节的将进行图片压缩的操作。总而言之，url-loader是file-loader的上层封装