包管理操作笔记
安装项目依赖
npm / cnpm / pnpm
1 2 3 4 5 6 7 8 9 10
| npm install [package] // 简写 npm i [package]
// 安装指定版本 npm i[package]@[version] npm i [package]@[tag]
// 全局安装依赖 npm i -g [package]
|
yarn
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16
| // 安装 yarn add [package]
// 全局安装依赖 yarn global add [package]
// 安装全部依赖 yanr // or yarn install
// 安装指定版本 yarn add [package]@[version] yarn add [package]@[tag]
|
安装失败场景
可能安装依赖卡断,或者中断安装依赖,后面再重新安装,会提示报错这是因为有缓存的原因
方式一
删除 node_modules
包重新安装。
方式二
删除缓存
–save–dev作用
在安装我们依赖的时候,经常会看到后缀 --save
或 --save--dev
,入行那会什么都不懂照着写去,能用就行,结果开发好好的,线上就是不行。
1 2 3
| npm install vue --no-save npm install vue --save npm install @babel/core --save-dev
|
--no-save
查看 package.json
,文件内容不发生改变,在运行项目时能正常运行,当 npm i
时候,不会安装该依赖,提示安装该依赖。
--save
查看 package.json
会有一个 dependencies
对象,里面就是项目运行需要的依赖。 dependencies
代表项目运行所依赖的模块 简写 -S
1 2
| // 示例 npm install express -S
|
--save-dev
查看 package.json
会有一个 devDependencies
对象,里面就是项目开发时候需要的依赖。 devDependencies
代表项目开发所需要的模块 如:babel 是发布时,将 ES6 代码编译成 ES5 ,那么 babel 就是 devDependencies
。 简写 -D
^ 和 ~ 的区别
1 2 3 4 5 6 7 8 9 10 11 12 13
|
"dependencies": { "vue": "~2.5.0", "es6-promise": "^2.0.0" },
|
管理全局包
查看 npm 全局安装过的包
查看全局包哪些需要更新
1
| npm outdated -g --depth=0
|
更新全局的依赖
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20
| npm update -g
// 更新指定依赖 npm i [package]
// 可能报错 Remove the existing file and try again, or run npm with --force to overwrite files recklessly.
// 卸载依赖 npm uninstall -g [package]
// 清理 npm 缓存 npm cache clean --force
// 重新安装 npm i -g [package]
// 第二种 强制安装 npm install -g [package] --force // 也适用于yarn
|
查看 yarn 全局安装过的包
1
| yarn global list --depth=0
|
更新全局的依赖
1 2 3 4 5
| yarn global upgrade
// 更新指定依赖 yarn global add <package>@lates yarn global add yrm@lates
|
升级依赖项
npm / yarn 查看 项目 中包是否更新
1 2 3 4 5 6 7 8 9 10 11 12 13 14
| "dependencies": { "vue": "~2.6.0" },
npm update vue
npm i vue
yarn upgrade vue@2.6.14 指定版本 yarn upgrade vue@^
"dependencies": { "vue": "^2.6.14" }
|
删除依赖包
1 2 3 4 5 6 7 8 9 10 11
| "dependencies": { "vue": "^2.6.14" }
npm uninstall vue
yarn remove vue
// 删除全局依赖 npm uninstall -g <package> yarn global remove <package>
|
更新项目中所有依赖项
- npm-check
- npm-check-updates
二者目的相同,只是在更新过程中的一些交互展示形式存在一定的差异
npm-check-updates
安装
1
| npm install -g npm-check-updates
|
使用
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17
| ncu
[====================] 12/12 100% @vssue/api-github-v4 ^1.4.0 → ^1.4.7 @vssue/vuepress-plugin-vssue ^1.4.6 → ^1.4.8 @vuepress-reco/vuepress-plugin-back-to-top ^1.5.7 → ^1.6.0 @vuepress/plugin-google-analytics ^1.8.1 → ^1.8.2 @vuepress/plugin-pwa ^1.8.1 → ^1.8.2 dayjs ^1.10.4 → ^1.10.7 vuepress ^1.8.1 → ^1.8.2 vuepress-plugin-live2d-model ^1.0.0 → ^1.0.7 vuepress-plugin-one-click-copy ^1.0.2 → ^1.0.6
ncu -u ncu -u vuepress dayjs ...
|
npm-check
安装
1 2
| npm install npm-check -g 复制代码
|
使用
1 2 3 4 5
| // 查看可更新包 npm-check
// 升级所有依赖项 npm-check -u
|
切换国内镜像
目前常用的镜像列表
1 2 3 4 5
| npm ---- https://registry.npmjs.org/ cnpm --- https://registry.nlark.com/ taobao - https://registry.npm.taobao.org yarn --- https://registry.yarnpkg.com/ tencent- https://mirrors.cloud.tencent.com/npm/
|
查看当前镜像源
1 2 3 4 5 6 7 8 9
| yarn config get registry
npm config get registry
cnpm config get registry
pnpm config get registry
// https://registry.nlark.com/
|
设置镜像源
1 2 3 4 5 6 7 8
| // 全局使用 yarn config set registry https://registry.npm.taobao.org
npm config set registry https://registry.nlark.com/ // ...
// 临时在项目中使用 npm install --registry https://registry.npm.taobao.org
|
还原镜像源
1 2
| npm config set registry https://registry.npmjs.org // 根据上面的镜像列表替换就行
|
nrm / yrm 管理镜像源工具
1 2 3
| npm install -g yrm // or npm install -g nrm
|
列出当前镜像源列表
1 2 3 4 5 6 7 8 9
| yrm ls
npm ----- https://registry.npmjs.org/ cnpm ---- http://r.cnpmjs.org/ taobao -- https://registry.npm.taobao.org/ nj ------ https://registry.nodejitsu.com/ rednpm -- http://registry.mirror.cqupt.edu.cn skimdb -- https://skimdb.npmjs.com/registry yarn ---- https://registry.yarnpkg.com
|
测试
1 2 3 4 5
| yrm use taobao // https://registry.npm.taobao.org/
yrm test taobao // taobao - 187ms
|