素材巴巴 > 程序开发 >

使用yarn代替npm构建Vue项目

程序开发 2023-09-24 09:02:27

看到这个标题的时候,相信有些小伙伴会带有疑问,为什么明明可以使用npm来构建vue项目,现在却偏偏要使用yarn呢?
最简单最直接的原因是因为它快!并且要比你用npm快很多!
如果你想了解的更全面,我们来看yarn官方给出的解释

Yarn 是一个依赖管理工具。它能够管理你的代码,并与全世界的开发者分享代码。Yarn 是高效、安全和可靠的,你完全可以安心使用。
Yarn 能够让你使用其他开发者开发的代码,让你更容易的开发软件。如果你在使用中发现任何问题,欢迎发 issue 或者贡献代码,一旦问题被修复,你就可以继续使用 Yarn 战斗了。
代码是通过包(有时也被称为模块)进行共享的。 在每一个包中包含了所有需要共享的代码,另外还定义了一个 yarn.json 文件,用来描述这个包。

yarn的特点:快,安全,可靠

    速度超快。
    Yarn 缓存了每个下载过的包,所以再次使用时无需重复下载。 同时利用并行下载以最大化资源利用率,因此安装速度更快。
    超级安全。
    在执行代码之前,Yarn 会通过算法校验每个安装包的完整性。
    超级可靠。
    使用详细、简洁的锁文件格式和明确的安装算法,Yarn 能够保证在不同系统上无差异的工作。

下面简单介绍一下yarn的使用,以及如何使用yarn来构建一个vue项目
一、yarn的安装
1、和npm类似,在使用yarn之前必须确认系统已经安装好node.js,如果没有,请先安装node.js!安装好了输入node -v查看版本
2、如果node.js安装好了,那么可以根据官方给出的文档进行yarn的安装

使用yarn的好处:https://blog.csdn.net/csdn_yudong/article/details/82015885
3、如果你是windows系统,推荐你使用下载 .msi 文件的方法进行yarn的安装(方案一)

不过我觉得这三种方法都不好用,快速好用的安装方法应该还是使用 npm 来安装:(方案二)

npm install -g yarn

关于为什么使用 -g,以及 -g 会带来哪来影响,这个可以看我的这篇文章:npm详细介绍,里面详细介绍了为什么要使用 -g,以及 -g 的作用。

4、在命令行输入 yarn --version 确认是否安装成功

二、构建vue项目
1、全局安装vue脚手架 npm install -g vue-cli ,因为之前已经使用此命令全局安装过了,详情参见:https://blog.csdn.net/muzidigbig/article/details/80490884 所以这里使用 vue init webpack yarn2 直接创建一个基于 webpack 模板的新项目,并将之命名为 yarn2,注意不建议使用带-名称的项目名!
2、在命令行输入 vue init webpack yarn2 后,会出现一系列提示信息,根据你的需求进行选择就好


3、上述操作完成后,切换到项目根目录中:cd yarn2

4、安装项目的依赖:yarn/yarn install

5、运行项目:yarn start/yarn run dev

生成的项目目录中多了一个yarn.lock的文件,这个文件中主要是配置的package.json中的依赖信息,yarn生成的依赖包存储在node_modules中

 

npm与yarn比较:

Yarn 独有的命令:

    yarn licenses ls —— 允许你检查依赖的许可信息
    yarn licenses generate —— 自动创建依赖免责声明 license
    yarn why taco —— 检查为什么会安装 taco,详细列出依赖它的其他包
    yarn why vuepress —— 检查为什么会安装 vuepress,详细列出依赖它的其他包
 

 

 


标签:

上一篇: 使用@antv/x6-vue-shape 遇到的问题 下一篇:
素材巴巴 Copyright © 2013-2021 http://www.sucaibaba.com/. Some Rights Reserved. 备案号:备案中。