11.5 包和包管理器

什么是包

包 - 'Package'，可以帮我们维护，特定模块他们之间的关系；

一般情况下，一个包就完成摸个特定的功能，一个包中也会有很多模块；

node中提供了npm作为包的管理工具；npm（node.js package management）

查看是否有npm：npm -v

npm官网：https://www.npmjs.com/

这个网站是用来托管所有开源的包的，npm的网站实际上已经成为世界范围中，最大的一个平台，在这个网站上托管的项目是相当庞大的；

包：多个模块可以形成包，不过要满足特定的规则才能形成规范的包

npm：全球最大的模块生态系统，里面所有的模块都是开源免费的，也是node.js的管理工具

npm和node的关系？（npm：node package manager）: 其实就是买鞋送鞋带的关系；

npm是node官方出的包管理器，有官方出的，就有别人出的；专门用于管理包；

第三方包的管理

安装

npm install -g 安装的包 // 全局安装

npm install -g jquery npm install 包名称 // 本地安装

npm install 包名称 --save // 写入到package文件中

npm5中不添加save，表示：我帮你下载，但是不帮你把文件写入到package.json文件中；

npm6出来了，这时候--save就可以不用写了

查找相关的包 / 或者使用npm官网

npm search jquery

安装软件的执行流程

![[1280X1280 (31).PNG]]

当安装完一个包，该包的名字会自动写入到package.json中的【dependencies（生产依赖）里】

![[1280X1280 (32).PNG]]

dependencies依赖，依赖分为两种【生产依赖，开发依赖】

npm i jquery -D // 安装开发依赖 - development：会将开发过程中用到的语法检查，压缩代码，扩展css前缀全部都布置好之后发布

![[1280X1280 (33).PNG]]

全局安装

npm i xxxx -g

npm root -g // 获取npm全局安装的根目录

npm root // 查看当前文件夹npm安装的目录

安装指定版本

npm view jquery version // 查看当前已经下载的版本

npm view jquery versions // 查看所有的jquery版本

npm i xxx@yyy // 安装指定版本

更新包

npm update xxxx

删除包

npm remove xxxx

npm uninstall xxxx

查看包

npm list -g 查看第三方包的位置

npm list 查看当前包的位置

npm root -g // 查看全局包安装路径

npm root // 查看本地包安装路径

注意：Mac 下默认的全局路径是:/usr/local/lib/node_modules

安装第三方包

模拟安装art-template包

![[be5bfe82-7d2d-40db-b275-eecf9eef8bce.png]]

![[f60b23c7-623c-474f-a650-33fb9dbab323.png]]

npm install art-template@4.8.2 //安装

npm audit fix和npm audit // 修复

npm update art-template@latest // 更新到最新版本

安装之后怎么使用包

/*
index.js 创建包的入口文件
*/
var template = require('art-template');
var html = template(__dirname + '/tpl-user.art', {
    user: {
      name: 'aui'
    }
});
console.log(html);

// tpl-user.art
{{if user}}
  <h2>{{user.name}}</h2>
{{/if}}

cnpm的使用

![[c636fb26-ffbe-4998-927d-cbaaf4fa1522.png]]

![[47784465-8d97-45b7-9fc9-910b05255997.png]]

npm config get registry // 查看npm国外连接服务器的地址 https://registry.npmjs.org/

修改nodejs镜像地址

npm config set registry https://registry.npmmirror.com

1.使用淘宝的 cnpm代替npm

原来~~https://registry.npm.taobao.org~~ 淘宝的镜像地址已经被弃用，使用https://registry.npmmirror.com

npm config set registry https://registry.npmmirror.com

npm install -g cnpm // 安装

npm install -g cnpm --registry=https://registry.npmmirror.com // 使用淘宝镜像安装

cnpm npm install jquery // 使用国外服务器下载

cnpm install jquery // 使用淘宝的服务器下载

如果不像安装cnpm，还想使用淘宝的服务器来下载，那就可以使用淘宝镜像

npm install jquery --registry=https://registry.npmmirror.com

![[bdefc986-3190-42c5-b5a6-629ac5de462e.png]]

// 查看npm配置信息 npm config list 或者 npm config get registry

yarn的使用

npm是node官网出品的； yarn是facebook公司出的；

yarn -v

npm install -g

yarn sudo

npm install -g yarn 需要输入用户名和密码；

yarn add jquery@3.2.1 yarn global add webpack // 下载全局的包

yarn remove webpack // 移除某个包

yarn global remove webpack // 移除全局的包

yarn run xxx // 运行项目

yarn config set registry https://registry.npmmirror.com// 配置淘宝镜像

// 常用命令
npm （nodejs packgae management）
npm -v 查看npm的版本
which node / where node 查看是node安装的位置
平台网站
包管理工具
安装 npm install -g 安装的包的名字
npm install -g jquery 全局安装
npm install jquery 局部安装
npm install jquery --save 
npm install jquery --S
npm i jquery -g
npm uninstall jquery  移除包
npm remove jquery
npm install jquery -D 重新安装
npm root -g  全局安装的目录 /usr/local/lib/node_modules
npm view jquery versions 查看某个包的所有版本
npm i jquery@3.2.0  安装指定版本
npm update jquery  更新到最新版本
执行创建的包
npm init -y   安装默认包
npm init      安装自定义的包
node . 
node index.js
npm install -g cnpm  安装cnpm 
npm config get registry
https://registry.npmmirror.com  淘宝镜像
https://registry.npmjs.org/       国外的地址
npm install -g cnpm --registry=https://registry.npmmirror.com
cnpm 
npm install jquery 
cnpm install jquery
yarn 命令
查看是否有yarn：   yarn -v
windows直接使用： npm install -g yarn
mac安装需要用：sudo npm install -g yarn
安装包：yarn add jquery@3.2.1
移除包：yarn remove jquery
移除全局的包：yarn global remove jquery
运行yarn：yarn run xxx
查看某个包的详细信息：yarn info xxx
设置淘宝镜像：yarn config set registry https://registry.npmmirror.com

pnpm

官网地址：https://pnpm.io/zh/installation

优势：节约磁盘空间并提升安装速度

performant npm ，意味"高性能的 npm"。

pnpm由npm/yarn衍生而来，解决了npm/yarn内部潜在的bug，极大的优化了性能，扩展了使用场景。被誉为"最先进的包管理工具"，它较npm和Yarn在性能上得到很大提升，被称为快速的，节省磁盘空间的包管理工具。

当使用 npm 或 Yarn 时，如果你有 100 个项目使用了某个依赖（dependency），就会有 100 份该依赖的副本保存在硬盘上，而在使用 pnpm 时，依赖会被存储在内容可寻址的存储中，所以：

1. 如果你用到了某依赖项的不同版本，只会将不同版本间有差异的文件添加到仓库。 例如，如果某个包有100个文件，而它的新版本只改变了其中1个文件。那么 pnpm update 时只会向存储中心额外添加1个新文件，而不会因为仅仅一个文件的改变复制整新版本包的内容。

2. 所有文件都会存储在硬盘上的某一位置。 当软件包被安装时，包里的文件会硬链接到这一位置上对应的文件，而不会占用额外的磁盘空间。 这允许你跨项目地共享同一版本的依赖。

因此，您在磁盘上节省了大量空间，这与项目和依赖项的数量成正比，并且安装速度要快得多！

安装

通过npm安装，也可以在官网查看其他安装方式

npm install -g pnpm

通过下述命令查看已安装的pnpm的版本

pnpm -v

使用

1. 初始化，生成package.json文件

pnpm init

2. 安装依赖

pnpm install xxx

3. 运行package.json中定义的scripts脚本，启动服务即可

pnpm run dev

升级版本

pnpm add -g pnpm to update

设置源

• 查看源：pnpm config get registry

• 切换源：pnpm config set registry <淘宝源或其他源地址>

管理依赖

• 安装依赖包到 dependencies ：pnpm add <pkg>

• 安装依赖包到devDependencies：pnpm add -D <pkg>

• 安装依赖包到optionalDependencies：pnpm add -O <pkg>

• 全局安装依赖包：pnpm add -g xxx

• 安装项目全部依赖：pnpm install，别名 pnpm i

• 更新依赖包：pnpm update，别名 pnpm up

• 删除依赖包：pnpm remove，别名 pnpm rm/uninstall/un

查看依赖

• 查看本地安装的依赖：pnpm list，别名 pnpm ls

• 查看全局安装的依赖：pnpm list --global，别名 pnpm ls --g

• 检查过期的依赖：pnpm outdated

运行脚本

• 运行自定义脚本：pnpm run xxx，别名 pnpm xxx

• 运行test测试脚本：pnpm test

• 启动套件创建项目： pnpm create

• 运行start启动命令：pnpm start

参考资料：https://juejin.cn/post/7124142007659790372