npm 深入了解

npm 深入了解

1. package.json 各个字段含义

{
  "name": "xxx-ui-components", // 包名
  "version": "0.4.11", // 版本
  "description": "xxx-ui-components", // 包描述，搜索用
  "keywords": "xxx", // 关键字，搜索用
  "homepage": "https://xxx.com/", // 项目主页
  "main": "dist/index/index.js", // 指定程序主要入口
  "module": "dist/index/index.js",
  "files": [ // 作为依赖项安装时要包含的条目
    "dist",
    "src",
    "flow-typed"
  ],
  "directories": {
    "dist": "dist"
  },
  "scripts": { // 脚本
    "start": "webpack --watch --env.needExample --config ./webpack.config.js",
  },
  "author": "xxx@163.com", // 作者
  "license": "ISC", // 许可证，使用限制
  "devDependencies": {
    "webpack": "^4.35.0",
  },
  "dependencies": {
    "antd": "^3.8.4",
  },
  "publishConfig": { // 发布时的镜像地址配置
    "registry": "http://repo.xxx.com/repository/xxx-ui-components/"
  },
  "repository": { // 指向代码所在位置
    "type": "git",
    "url": "ssh://git@phabricator.xxx.com/source/ui-components.git"
  },
  "bin": { // 指定 npm 可执行文件
    "xxx": "./script/xxx.js"
  }
}

1. name 包名

一个简短的字符串与版本号组成唯一标识符，不打算发布则名称是可选的

包的范围: @scope/package 是一种将相关包分组在一起的方式，例如：

# npm install @storybook/addon-knobs @storybook/addon-links 

. # node_modules/@storybook
├── addon-knobs
├── addon-links
└── ... 

2. files

一个数组，定义当前 package publish 之后，被作为依赖项 install 时需要包含的条目（文件或者目录）
它与 .gitignore 共同作用，files 字段的优先级较高，以下文件会始终包含

• package.json
• README
• CHANGES / CHANGELOG / HISTORY
• LICENSE / LICENCE
• NOTICE
• “main”字段中的文件

3. main 程序入口

main 字段指向一个文件，作为程序的入口，当该软件包被安装时，通过 require('package') 获得 import 'package' 将返回这个文件 exports 的对象

4. bin 指定可执行文件

用来帮助安装 npm 可执行文件，例如：

1. package.json 中加入 bin 配置

"bin": { // 指定 npm 可执行文件
  "xxx": "./script/xxx.js"
}

2. 在项目中通过 npm install 安装这个 package 时，npm 会分析每个安装包的 package.json 将其中的 bin 字段指向的脚本，安装到 node_modules/.bin/下

3. 在命令行调用 xxx 时，实际就是调用这个可执行文件

5. dependencies devDependencies peerDependencies

三者都是项目的依赖

1. dependencies 与 devDependencies 区别：一般项目都是编译后再 publish 到 npm 镜像的，也就是说使用的时候不需要进行编译，编译用到的第三方包也不需要被下载，这些编译相关的第三方包一般放在 devDependencies 下, 而 package 执行所必须用到的 package 则放在 dependencies 下
2. peerDependencies 表示，如果你安装了当前包 ,那么你还需要安装 以下的 package, 其作用就是提示宿主环境去安装满足 peerDependencies 中所指定的 package，这样在包中的引用就都是宿主环境统一安装的包，解决与宿主环境安装的包版本不一致的问题

2. package 包的定义

一个 package 是什么样的结构，通过 npm install 怎么安装的

执行npm install package 时，npm 回到镜像仓库 registry 中查找包名对应的地址，并下载安装，
除此之外 一个 http 地址 | 一个 git 地址 | 一个 文件夹路径 都可以作为一个 package 被安装

一个文件夹地址作为 package 被安装

1. 创建一个 package 目录，名为 /ppk

// 给这个目录创建 package.json 及入口问价 index.js

// index.js
module.exports = {
  run() {
    console.log('run')
  }
};

// package.json
{
  "name": "ppk",
  "version": "1.0.0",
  "description": "",
  "main": "index.js", // 指向入口文件
}

2. 命令行中安装这个 package

npm install ./ppk

3. 进入 node_modules/ 下，可以发现 ppk 这个包已经被安装，并且软连接到了 根目录下的 ppk/

3. node_modules 结构

npm 2.x 版本中的 node_modules 是树状结构，依赖的依赖被逐级安装在当前包的 node_modules 下，如下

. # /node_modules/ 
├── ppk
    ├── index.js
    ├── node_modules
    │   └── qqk
    │       ├── index.js
    │       ├── node_modules
    │       │   ├── # ...
    │       └── package.json
    └── package.json

npm 3.x 开始 node_modules 变为扁平结构，package 的依赖与 package 被下载到同一级目录，如下

├── ppk
│   ├── index.js
│   └── package.json
├── qqk
│   ├── index.js
│   └── package.json
# ...

1. 依赖的依赖是否会被加载

• 依赖的依赖如果定义在 dependencies 则会被下载
• 定义在 devDependencies 不会被下载
• 定义在 peerDependencies 则会检查已下载的 package 是否符合 peerDependencies 中的版本约定，不符合会提示下载

2. 依赖版本冲突

• 因为依赖的依赖也要被下载，所以经常会出现 两个依赖同时引用了 B-package 但是引入的版本不一致，这个时候 npm 在安装时会遍历整个依赖树，计算出最合理的文件夹安装方式
• 首先 npm 会将包安装到尽可能高的层级
• 其次，被冲突的包会安装到引用他的 package 下，类似 npm 2.x 版本中的树状结构

4. package-lock.json 怎么看

由 npm 5.x 加入，用于锁定依赖的安装结构，其结构是与 node_modules 一一对应的

每个包都会有一下字段

• version： 版本
• resolved： 安装源
• integrity：内容hash
• requires：package.json 中记录的 dependencies
• dependencies：有了版本冲入，依赖被下载到当前包下边，这里放的是被放在当前包 node_modules 下的 package信息

5. npm 配置

npm config 命令与 .npmrc 文件

• npm config 用于处理 npm 相关的配置，修改后的配置会在 .npmrc 中体现，直接修改 .npmrc 也可以修改配置
• .npmrc 不但可以设置全局的，每个项目也可以设置自己的 .npmrc