npm到yarn的使用

小鱼儿

一、yarn的优点及与npm的区别

首先我们来说说,为什么好好的npm不用,要使用yarn,当然我目前还没有体会到他的优点,因为刚刚使用,但是作为一名小菜鸟,遇到这种更好的技术还是想使用探究一下,下面我们来说yarn相较于npm的优点:

  1. 速度快,主要体现在下面两个方面:

    • 并行安装:无论是npm还是yarn在执行包的安装时,都会执行一系列任务。npm是按照队列执行每个package,也就是必须要等到当前的package安装完毕之后才进行下一个package的安装。而yarn是同步执行所有任务,提高了性能。
    • 离线模式:如果之前已经安装了软件包,用yarn再次安装时会从缓存中获取,不用像npm再从网络下载了
  2. 安装版本统一:为了防止拉取到不同的版本,yarn有一个锁定文件yarn.lock记录了被确切安装上的模块的版本号。每次只要新增了一个模块,yarn就会创建或更新yarn.lock这个文件。这么做就保证了每次拉取同一个项目依赖时,使用的都是一个模块版本。npm其实也可以做到处处使用同一个模块的版本,但需要开发者执行npm shrinkwrap命令。这个命令将会生成一个锁定文件,在执行npm install时,该锁定文件会先被读取,和yarn读取yarn.lock文件一个道理。npm和yarn的不同之处在于,yarn会默认生成这样的锁定文件,而npm要通过shrinkwrap命令生成npm-shrinkwrap.json文件,只有当这个文件存在的时候,packages的版本信息才会记录和更新。
  3. 更简洁的输出:npm的输出信息比较冗长。在执行npm install <package>时,命令行上会不断打印出所有被安装上的依赖。相比之下,yarn简洁太多,默认情况下,结合了emoji直观且直接的打印出必要的信息,也提供了一些命令供开发者查询额外的安装信息。
  4. 多注册来源处理:所有的依赖包,不管他被不同的库间接关联多少次,安装这个包时,只会从一个注册来源去装,要么是npm要么是bower,防止出现混乱不一致。
  5. 更好的语义化:yarn改变了一些npm命令的名称,比如yarn add/remove,感觉上比npm原本的install/uninstall更加易懂清晰。
npm yarn
npm install yarn
npm install webpack --save yarn add webpack
npm uninstall webpack --save yarn remove webpack
npm install webpack --save-dev yarn add webpack -dev
npm update --save yarn upgrade
  • 查看版本

    yarn --version
    npm -version (node -v)

  • 安装淘宝镜像
yarn config set registry 'https://registry.npm.taobao.org'     
npm install -g cnpm --registry=http://registry.npm.taobao.org 
  • 初始化某个项目
    yarn init
    cnpm init
  • 默认安装项目依赖
    yarn
    npm install
  • 安装某个依赖,并默认保存到package
    yarn add **
    npm install ** --save
  • 卸载某个项目依赖
    yarn remove **
    cnpm uninstall ** --save
  • 更新某个项目依赖
    yarn upgrade **
    cnpm update ** --save
  • 安装某个全局项目依赖
    yarn global add **
    cnpm install ** -g
  • 安装某个特定版本号的项目依赖
    yarn add **@
    cnpm install **@1.1.1 --save
  • 发布、登录、登出,一系列npm registry 操作
    yarn publish/login/logout
    npm publish/login/logout
  • 运行某个命令
    yarn run/test
    npm run/test

二、如何从npm转换到yarn环境

  1. 没有使用过yarn的要先全局安装yarn
    npm install -g yarn
  2. 在已存在npm的项目中运行yarn,相当于yarn install
    yarn (运行成功后会在项目根目录下生成yarn.lock文件)
  3. 这时候会报错,什么node_modules/webpack-dev-server/node_modules/ansi-regex/index.js找不到之类的,我是绞尽脑汁,找了半天错误到底在哪里,啊啊啊啊,后来只是重新运行就好了,fuck!你运气好的话可能不会报错哈哈哈哈。插入一个小知识,这个是因为我们的域名写死了端口号,所以我们必须用固定的端口号启动,不然打不开页面。so,mac下查看进程的命令:sudo lsof -i:8086;杀死进程的命令:sudo kill -9 24830
  4. 如果你认为yarn不适合你,你仍能够回去使用npm,并不需要做任何的变化。如果这个项目没有人需要使用yarn,那么你就可以删除你的yarn.lock文档
  5. 如果你的同伴在项目中还是使用npm,而你用yarn,那么yarn.lock和package.lock.js直接都提交就好了。
阅读 4.8k
55 声望
3 粉丝
0 条评论
55 声望
3 粉丝
宣传栏