一.Node Package Manager(node 包管理器)
1.查看 npm 版本
npm -v
2.npm淘宝镜像(可选)
# 设置全局的npm淘宝镜像
npm config set registry https://registry.npm.taobao.org
# 也可以切换回默认全局镜像
npm config set registry https://registry.npmjs.org
3.npm 常用命令简写说明
方便统一和阅读,文中全部使用简写方式。
-g: 为 --global 的缩写,表示安装到全局目录里
-S: 为 --save 的缩写,表示安装的包将写入package.json里面的dependencies
-D: 为 --save-dev 的缩写,表示将安装的包将写入packege.json里面的devDependencies
i: 为install的缩写,表示安装
4.npm 安装模块
npm init --yes 初始化当前目录
npm i 安装所有依赖
npm i 包名 安装模块到默认dependencies
npm i 包名 -g 会安装到配置的全局目录下
npm i 包名 -S/可以不写-S 安装包信息将加入到dependencies生产依赖
npm i 包名 -D 安装包信息将加入到devDependencies开发依赖(仅在项目上线前需要用到的包)
6. npm 卸载模块
npm uninstall express # 卸载模块,但不卸载模块留在package.json中的对应信息
npm uninstall express -g # 卸载全局模块
npm uninstall express --save # 卸载模块,同时卸载留在package.json中dependencies下的信息
npm uninstall express --save-dev # 卸载模块,同时卸载留在package.json中devDependencies下的信息
7. npm 更新模块
npm update jquery # 更新最新版本的jquery
npm update jquery@2.1.0 # 更新到指定版本号的jquery
npm install jquery@latest # 可以直接更新到最后一个新版本
8. npm 查看命令
npm root # 查看项目中模块所在的目录
npm root -g # 查看全局安装的模块所在目录
npm list 或者 npm ls # 查看本地已安装模块的清单列表
npm view jquery dependencies # 查看某个包对于各种包的依赖关系
npm view jquery version # 查看jquery最新的版本号
npm view jquery versions # 查看所有jquery历史版本号(很实用)
npm view jquery # 查看最新的jquery版本的信息
npm info jquery # 查看jquery的详细信息,等同于上面的npm view jquery
npm list jquery 或 npm ls jquery # 查看本地已安装的jquery的详细信息
npm view jquery repository.url # 查看jquery包的来源地址
9. npm 其他命令
npm cache clean # 清除npm的缓存
npm prune # 清除项目中没有被使用的包
npm outdated # 检查模块是否已经过时
npm repo jquery # 会打开默认浏览器跳转到github中jquery的页面
npm docs jquery # 会打开默认浏览器跳转到github中jquery的README.MD文件信息
npm home jquery # 会打开默认浏览器跳转到github中jquery的主页
二.yarn和npm命令对比
三.第三方模块的使用方法(npm包的使用)
(1)使用方式
- 初始化项目。npm init 如果之前已经初始化,则可以省略。
- 安装包。 npm install 包名。[注意:保持联网的状态哈]
- 引入包,使用 const 常量名 = require('包名')
npm在下载包的过程中遇到的三个文件(夹)
node_modules文件夹
执行逻辑(当键入 npm i 包名)之后
-
如果有package.json
(1) 修改package.json文件。根据开发依赖和生产依赖的不同,决定把这句记录在加在devDependencies(开发依赖)或者是dependencies(生产依赖)列表中。
(2) 修改node_modules文件夹 -
如果有node_modules文件夹,则直接在下面新建名为XXX的文件夹,并从npm中下来这个包。如果这个包还有其它的依赖,则也会下载下来。如果没有node_modules,则先创建这个文件夹,再去下载相应的包
-
如果没有package.json。会给一个警告信息。
三.关于npm中遇到的问题
第一种易错点
在webpack
工程中安装eslint-loader时报错:
npm ERR! code ERESOLVE
npm ERR! ERESOLVE unable to resolve dependency tree
npm ERR!
npm ERR! While resolving: xtx-shop@0.1.0
npm ERR! Found: eslint-plugin-vue@8.7.1
npm ERR! node_modules/eslint-plugin-vue
npm ERR! dev eslint-plugin-vue@"^8.0.3" from the root project
npm ERR!
npm ERR! Could not resolve dependency:
npm ERR! peer eslint-plugin-vue@"^7.0.0" from @vue/eslint-config-standard@6.1.0
npm ERR! node_modules/@vue/eslint-config-standard
npm ERR! dev @vue/eslint-config-standard@"^6.1.0" from the root project
npm ERR!
npm ERR! Fix the upstream dependency conflict, or retry
npm ERR! this command with --force, or --legacy-peer-deps
npm ERR! to accept an incorrect (and potentially broken) dependency resolution.
npm ERR!
npm ERR! See C:\Users\柳雄飞\AppData\Local\npm-cache\eresolve-report.txt for a full report.
npm ERR! A complete log of this run can be found in:
npm ERR! C:\Users\柳雄飞\AppData\Local\npm-cache\_logs\2022-07-08T01_40_19_616Z-debug.log
原因
ERESOLVE无法解析依赖关系树
,应该是npm版本过高导致的,@7.0.0和@8.0.0都出出现这个问题,@6.0.0则不会。
@7.0.0版本后默认安装peerDependencies,它会检查版本modules之间的版本冲突问题,如果发生冲突,则终止安装。
解决方法
以我需要安装的eslint-loader为例:
npm i --legacy-peer-deps eslint-loader
--legacy-peer-deps
的作用是忽略同一个module不同版本的问题,使同一个module的不同版本可以在项目中共存。
第二种易错点
如果我们可能因为网络原因导致下载的包不完整,这就可能造成删除node_modules重新下载的依旧是问题包,假如删除 node_modules
重新下载问题依旧,此时就需借助命令行清除缓存。
// 清除缓存
npm cache clean --force复制代码