使用yarn代替npm构建Vue项目

版权声明:本文为博主原创文章,未经博主允许不得转载。 https://blog.csdn.net/muzidigbig/article/details/85090028

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

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

下面简单介绍一下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中

猜你喜欢

转载自blog.csdn.net/muzidigbig/article/details/85090028