前端开发过程中用到的工具和命令实在太多了,可能每隔一段时间项目中就会碰到与之相关的问题,有时傻傻分不清楚它们到底是在什么场景使用解决什么问题的,于是好好学习了一下来做个记录😉
nvm
nvm是用来对node版本进行管理的,在实际开发中,不同项目模块依赖的nodejs版本可能会不一样,有些支持高版本而有些却只支持低版本,这个时候如果手动的管理nodejs是在是太麻烦了,那么nvm就应运而生了
安装
命令
| 描述 | 命令 |
|---|---|
| 查看nvm指令 | nvm -h |
| 查看nvm版本 | nvm version |
| 查看本地node版本列表 | nvm list |
| 查看可安装的node版本 | nvm list available |
| 安装指定的node版本 | nvm install 14.17.0 |
| 安装最新的node版本 | nvm install latest |
| 切换至指定的node版本 | nvm use 14.17.0 |
| 卸载指定的node版本 | nvm uninstall 14.17.0 |
nrm
nrm全称npm registry manager,是npm镜像源管理工具,默认情况下项目安装依赖是去国外npm服务器拉取,这很大程度上取决于您的网络环境,可能多半情况下载依赖是不成功的,于是在国内出现了各种镜像,会不定时的同步npm上的资源包,让国内的开发者下载更加的通畅,nrm就是用来管理各种镜像的
安装
npm i nrm -g
命令
| 描述 | 命令 |
|---|---|
| 查看nrm指令 | nrm -h |
| 查看nrm版本 | nrm -V |
| 查看nrm镜像列表 | nrm ls |
| 切换nrm镜像源 | nrm use taobao |
| 删除源 | nvm del taobao |
| 新增镜像源地址 | nrm add myNpm http://myNpm.com |
| 测试镜像源 | nrm test npm |
| 查看当前镜像源 | npm config list |
包管理器
npm
npm是node自带的包管理工具(npm package manage),用来管理项目中的各种依赖包,服务器在国外,安装依赖包不稳定
基础命令
| 描述 | 命令 |
|---|---|
| 初始化 | npm init |
| 安装包 | npm install xx |
| 全局安装包 | npm install xx -g |
| 卸载包 | npm uninstall xx |
| 安装所有依赖 | npm install |
npx
npx是执行node软件包的命令工具(npm package execute),它从npm5.2版本开始, 就与npm捆绑在一起,如果没有可以手动安装,在npm的基础之上,npx让npm包中的命令行工具和其他可执行文件在使用上变得更加简单
npm i npx -g
npx作用
执行如下命令
npx my-package
- 默认情况下,首先检查项目路径中是否存在要执行的包, 然后在系统变量路径中去查找
- 如果存在则执行
- 如果不存在,意味着尚未安装对应的软件包,npx将安装软件包最新版本,然后执行它
- 执行完成后将会把软件包从本地缓存删除
npx my-package --no-install
此命令告诉npx,my-package包应该仅被执行, 如果之前未安装,则不安装
注:npx会以临时缓存来保存包的二进制文件,当执行结束,npx将从系统中删除已安装的缓存二进制文件, 不会造成全局污染
npx使用场景
- 执行node软件包
如果有一个软件包my-package,我们要执行它,默认情况下我们需要输入命令执行
./node_modules/bin/my-package
还可以在package.json中配置
"scripts": {
"myPackage": "./node_modules/bin/my-package"
},
然后执行 npm run myPackage
以上方法都有点小麻烦, 需要配置或输入较长的命令, 如果用npx命令, 则方便的多, 直接执行软件包名
npx my-package
- 初始化项目
如果我们要初始化vue和react项目,必须提前安装对应的脚手架工具cli,那么使用npx就不用安装了
npx @vue/cli create my-project
npx create-react-app my-project
cnpm
安装
npm install -g cnpm --registry=http://registry.npm.taobao.org
cnpm是淘宝团队维护的,服务器在国内,主要解决安装依赖包慢和不成功的问题,会定期同步npm的资源包,同步频率目前大概为10分钟,命令与npm类似
yarn
npm i yarn -g
yarn是facebook新造的一个包管理器轮子,相比npm而言它更快速、安全、可靠,主要是为了解决npm的一些弊端,但并不会完全取代npm
基础命令
| 描述 | 命令 |
|---|---|
| 初始化 | yarn init |
| 安装包 | yarn add |
| 全局安装包 | yarn global |
| 卸载包 | yarn remove |
| 安装所有依赖 | yarn install |
pnpm
全称:performant node packae manage 高性能的npm包管理器,简单来说是功能与npm类似,但是性能比npm好
pnpm官网介绍是:速度快、节省磁盘空间的软件包管理器
基础命令
| 描述 | 命令 |
|---|---|
保存到 dependencies 配置项下 | pnpm add sax |
保存到 devDependencies 配置项下 | pnpm add -D sax |
保存到 optionalDependencies 配置项下 | pnpm add -O sax |
| 安装软件包到全局环境中 | pnpm add -g sax |
安装标记为 next 的版本 | pnpm add sax@next |
安装指定版本 3.0.0 | pnpm add sax@3.0.0 |