美文网首页
包管理工具(npm/cnpm/yarn/pnpm/npx/nvm

包管理工具(npm/cnpm/yarn/pnpm/npx/nvm

作者: CodeMT | 来源:发表于2022-09-21 14:00 被阅读0次

    npm

    中文文档:https://www.npmjs.cn/

    • npm install的时候巨慢。特别是新的项目拉下来要等半天,删除node_modules,重新install的时候依旧如此。
    • 同一个项目,安装的时候无法保持一致性。由于package.json文件中版本号的特点,

    下面三个版本号在安装的时候代表不同的含义。

    "5.0.3", // 表示安装指定的5.0.3版本
    "~5.0.3", // 表示安装5.0.X中最新的版本
    "^5.0.3" // 表示安装5.X.X中最新的版本
    

    常常会出现同一个项目,有的同事是OK的,有的同事会由于安装的版本不一致出现bug。

    • 安装的时候,包会在同一时间下载和安装,中途某个时候,一个包抛出了一个错误,但是npm会继续下载和安装包。因为npm会把所有的日志输出到终端,有关错误包的错误信息就会在一大堆npm打印的警告中丢失掉,并且你甚至永远不会注意到实际发生的错误。

    cnpm

    • cnpmnpm用法完全一致,只是在执行命令时将npm改为cnpm
    • npm安装插件是从国外服务器下载,受网络影响大,可能出现异常,如果npm的服务器在中国就好了,于是淘宝团队干了这事。来自官网:“这是一个完整 npmjs.org镜像,你可以用此代替官方版本(只读),同步频率目前为 10分钟 一次以保证尽量与官方服务同步。

    安装

    npm install -g cnpm --registry=https://registry.npm.taobao.org
    

    yarn

    中文文档:https://www.yarnpkg.cn/getting-started

    Yarn是由Facebook、Google、Exponent 和 Tilde 联合推出了一个新的 JS 包管理工具 ,是为了弥补 npm 的一些缺陷而出现。

    • 安装速度快 (服务器速度快 , 并且是并行下载)
    • 版本锁定,安装版本统一
    • 缓存机制,如果之前已经安装过一个软件包,用Yarn再次安装时之间从缓存中获取,就不用像npm那样再从网络下载了

    安装

    npm install -g yarn
    

    Yarn和npm命令对比:

    npm yarn
    npm install yarn
    npm install react --save yarn add react
    npm uninstall react --save yarn remove react
    npm install react --save-dev yarn add react --dev
    npm update --save yarn upgrade
    查询当前配置的镜像 设置成淘宝镜像
    npm get registry yarn config get registry
    npm config set registry https://registry.npm.taobao.org yarn config set registry https://registry.npm.taobao.org

    pnpm

    中文文档:https://www.pnpm.cn/

    • pnpm运行起来非常的快,超过了npmyarn
    • pnpm采用了一种巧妙的方法,利用硬链接和符号链接来避免复制所有本地缓存源文件,这是yarn的最大的性能弱点之一
    • 使用链接并不容易,会带来一堆问题需要考虑。
    • pnpm继承了yarn的所有优点,包括离线模式和确定性安装

    安装

    npm install -g pnpm  // 通过 npm 安装 pnpm
    npx pnpm add -g pnpm  // 通过 npx 安装 pnpm
    

    一旦安装完 pnpm之后,就无需使用其它软件包管理器来更新pnpm了。 你可以让pnpm 自己来更新自己,如下所示:

    pnpm add -g pnpm
    

    npx

    npm使用教程:http://www.ruanyifeng.com/blog/2019/02/npx.html

    • npm 从5.2版开始,增加了 npx 命令。它有很多用处,本文介绍该命令的主要使用场景。
    • Node 自带 npm 模块,所以可以直接使用 npx 命令。万一不能用,就要手动安装一下。
    npm install -g npx
    

    (1)npx 会帮你执行依赖包里的二进制文件。引入这个命令的目的是为了提升开发者使用包内提供的命令行工具的体验。在以往中,我们在 node 项目中要执行一个脚本,需要将它在 scripts 中声明:

    "scripts": {
      "test": "echo \"Error: no test specified\" && exit 1",
      "init:runtime-only": "vue init webpack vue-cms"
    }
    

    然后执行命令

    npm run init:runtime-only
    

    它其实本质还是运行

    vue init webpack vue-cms
    

    用了 npx 以后呢,你不需要在 scripts 中声明了,就可以直接敲键盘了(npx 开头,然后接你要执行的内容):

    npx vue init webpack vue-cms
    

    (2)原理

    • npx 的原理很简单,就是运行的时候,会到 node_modules/.bin 路径和环境变量$PATH里面,检查命令是否存在。
      由于 npx 会检查环境变量$PATH,所以系统命令也可以调用。

    (3)等同于 ls npx ls

    • 注意,Bash 内置的命令不在$PATH里面,所以不能用。比如,cd是 Bash 命令,因此就不能用npx cd。

    (4)避免全局安装模块

    • npx 还能避免全局安装的模块。比如,create-react-app 这个模块是全局安装,npx 可以运行它,而且不进行全局安装。
    npx create-react-app my-react-app
    

    上面代码运行时,npx 将create-react-app下载到一个临时目录,使用以后再删除。所以,以后再次执行上面的命令,会重新下载create-react-app。

    • 下载全局模块时,npx 允许指定版本。
    npx uglify-js@3.1.0
    

    上面代码指定使用 3.1.0 版本的uglify-js压缩脚本。

    • 注意,只要 npx 后面的模块无法在本地发现,就会下载同名模块。比如,本地没有安装http-server模块,下面的命令会自动下载该模块,在当前目录启动一个 Web 服务。
    npx http-server
    

    (5)--no-install 参数和--ignore-existing 参数

    • 如果想让 npx 强制使用本地模块,不下载远程模块,可以使用--no-install参数。如果本地不存在该模块,就会报错。
    npx --no-install http-server
    
    • 反过来,如果忽略本地的同名模块,强制安装使用远程模块,可以使用--ignore-existing参数。比如,本地已经全局安装了create-react-app,但还是想使用远程模块,就用这个参数。
    npx --ignore-existing create-react-app my-react-app
    

    (6)使用不同版本的 node

    • 利用 npx 可以下载模块这个特点,可以指定某个版本的 Node 运行脚本。它的窍门就是使用 npm 的 node 模块。
    $ npx node@0.12.8 -v
    

    上面命令会使用 0.12.8 版本的 Node 执行脚本。原理是从 npm 下载这个版本的 node,使用后再删掉。
    某些场景下,这个方法用来切换 Node 版本,要比 nvm 那样的版本管理器方便一些。

    (7)-p 参数

    • -p参数用于指定 npx 所要安装的模块,所以上一节的命令可以写成下面这样。
    $ npx -p node@0.12.8 node -v 
    

    上面命令先指定安装node@0.12.8,然后再执行node -v命令。

    • -p参数对于需要安装多个模块的场景很有用。
    npx -p lolcatjs -p cowsay [command]
    

    (8)-c 参数

    • 如果 npx 安装多个模块,默认情况下,所执行的命令之中,只有第一个可执行项会使用 npx 安装的模块,后面的可执行项还是会交给 Shell 解释。
    $ npx -p lolcatjs -p cowsay 'cowsay hello | lolcatjs'
    

    报错

    • 上面代码中,cowsay hello | lolcatjs执行时会报错,原因是第一项cowsay由 npx 解释,而第二项命令localcatjs由 Shell 解释,但是lolcatjs并没有全局安装,所以报错。
    • -c参数可以将所有命令都用 npx 解释。有了它,下面代码就可以正常执行了。
    $ npx -p lolcatjs -p cowsay -c 'cowsay hello | lolcatjs'
    
    • -c参数的另一个作用,是将环境变量带入所要执行的命令。举例来说,npm 提供当前项目的一些环境变量,可以用下面的命令查看。
    $ npm run env | grep npm_
    
    • -c参数可以把这些 npm 的环境变量带入 npx 命令。
    $ npx -c 'echo "$npm_package_name"'
    

    上面代码会输出当前项目的项目名。

    nvm

    管理node版本的工具,例如在一台电脑上已经安装了node10以上,但有的项目需要node版本在8,由于要维护多个项目,卸载再安装又有很多麻烦和错误,使用nvm给前端同学带来了福利。

    安装

    github上下载最新版本 https://github.com/coreybutler/nvm-windows/releases

    • nvm-setup.zip 一个安装包,下载之后点击安装,连续点击下一步,无需任何配置,推荐
    • nvm-noinstall.zip 绿色免安装,使用之前需要配置,不推荐
    • Source code(zip):压缩的源码

    使用

    nvm install  8.10.0  // 例如:安装ndoe  8.10.0为node版本
    nvm list  // 查看nvm管理的node版本列表,正在使用的版本在列表前有星号标记
    nvm use 8.10.0  // 使用node指定版本 
    nvm uninstall 8.10.0 // 卸载指定node版本
    

    相关文章

      网友评论

          本文标题:包管理工具(npm/cnpm/yarn/pnpm/npx/nvm

          本文链接:https://www.haomeiwen.com/subject/xdbunrtx.html