gulp和yarn打包工具二分钟包会教程

 

1.什么是 gulp？

基于node的自动化构建工具

 

扩展：开发的时候分为2个节点一个是开发阶段  另外一个是部署阶段

 

     开发阶段：源文件不会被压缩

     

     部署阶段：全部文件须要压缩

2.gulp能干什么？

1  自动压缩JS文件

2  自动压缩CSS文件

3  自动合并文件

4  自动编译sass

5  自动压缩图片

6  自动刷新浏览器

 

3.怎么安装gulp？

  由于它基于nodeJS，所以须要先安装node环境

  安装完成后，打开你的命令行窗口

  输入： node -v

  检测一下node是否安装好了

 

　　　　二分钟开始

1.使用npm安装插件命令
     ：npm install <name> -g  全局安装  //先全局安装
     ：npm install <name> --save-dev：局部安装  //一会使用

《npm install -g cnpm --registry=https://registry.npm.taobao.org》淘宝镜像>>cnpm安装

cnpm -v//装完查看版本，验证是否安装正确
<-- cnpm替换npm快不少 -->

　　

 

2.初始化文件夹
　　cnpm init 《npm init -y 若是卡住的话》
 
　　做用：初始化一个gulp环境   建立一个package.json文件

　　

 

3.局部安装gulp
　　　　cnpm install gulp --save-dev：局部安装
 
     　　--save：将保存配置信息至package.json
     
    　　 -dev：保存至package.json的devDependencies节点
     
 

　　

4.新建gulpfile文件(重要)
　　gulpfile.js是gulp项目的配置文件，是位于项目根目录的普通js文件
 
　　gulpfile   package   node_modules 三个文件通常放在一块儿

gulpfile.js

const gulp = require("gulp")//引入

gulp.task("script",function(){
    gulp.src("src/index.txt")
    .pipe(gulp.dest("dist/js"))
})

　　

　　终端输入

gulp script

　　

　　项目里面就OK了

　　

yarn

1.什么是 Yarn？

这里引用中文官网的说明： 
Yarn 是一个依赖管理工具。它可以管理你的代码，并与全世界的开发者分享代码。Yarn 是高效、安全和可靠的，你彻底能够安心使用。

Yarn 可以让你使用其余开发者开发的代码，让你更容易的开发软件。若是你在使用中发现任何问题，欢迎发 issue 或者贡献代码，一旦问题被修复，你就能够继续使用 Yarn 战斗了。

代码是经过包（有时也被称为模块）进行共享的。 在每个包中包含了全部须要共享的代码，另外还定义了一个 package.json 文件，用来描述这个包。

 

一、安装  cnpm install yarn -g
2.项目里面 yarn add gulp --dev

　　

 

和gulp对比的命令

一、安装  cnpm install yarn -g

二、cnpm install gulp --save === yarn add gulp 

三、cnpm install gulp --save-dev === yarn add gulp --dev

四、更新 cnpm update 包名 == yarn update 包名

五、yarn remove 包名 == npm uninstall 包名 删除包

六、yarn clear 清除缓存

七、yarn install  == cnpm install <别人搞你的项目若是里面没有module 直接下载json中的包>

八、 yarn init -y  == cnpm init -y