留神：这篇文章假设你具备较好的 JS 根底，能够独立实现小规模的我的项目

你甚至应该晓得，常见的各种 JS 函数库和插件

同时，你应该具备肯定的我的项目部署的常识，例如晓得真正部署在服务器上的文件，跟开发的时候编写的文件是不同的
再同时，你必须要具备 nodeJS 的一些最基本知识。例如应用 npm 命令装置软件等，晓得 nodeJS 如何加载模块

如果你用过 sass 或者 less 那就更好不过了。

最重要的，就是你须要晓得常见的命令行操作，例如 cd、cd ..

假如你没听说过 sass 甚至不晓得 node 为何物，JQuery 不熟，甚至没用 JS 写过我的项目。

没关系，请点击浏览器右上角的叉号，整个世界都会复原来日的美妙

我的项目构建是什么？

比如说吧，当我的项目部署上线时，你所有的 JS 文件，要不要进行压缩减小体积，以便于加载的时候速度更快？

嗯，这个的确须要。

图片要不要压缩解决，以取得更好的加载速度？

嗯嗯，这个的确须要。

你编写的 JS 代码应用了 ES6 语法，为了防止浏览器兼容，要不要转换成 ES5？

嗯嗯嗯，这个的确须要。

你编写的 scss 源文件，要不要编译生成 css？

嗯嗯嗯嗯，这个的确须要。

你的 CSS 是不是也要压缩？

嗯嗯嗯嗯嗯，这个的确须要。

开发过程中，你的页面跟后盾服务器不在一台电脑上，你是否须要在本地搭建一个代理服务器以便于解决长期的跨域问题？

嗯嗯嗯嗯嗯嗯，这个的确须要。

以上这些相似的问题，Gulp 能够很轻松把它们放在一起实现。

Gulp 是一个 windows 零碎下的软件么？

很显然它不是。它是一个 NodeJS 编写的软件，须要咱们先装置 NodeJS 的运行环境。

这是 nodeJS windows 版网盘地址：

https://pan.baidu.com/s/1taPXX2Y01tVcqFUd3eATQQ 明码：bwf9

版本号：v8.9.3

装置好 NodeJS 环境，接下来做什么？

装置 Gulp

咱们须要应用 node 提供的一个叫做 npm 的命令

须要我关上命令行吗？

不然呢？难不成你想用 QQ 给 NodeJS 发个音讯？

关上后是不是像这样？

接下来进入你我的项目的根目录，而后输出命令 npm install gulp

装置时为什么要进入我的项目根目录？难道每个须要 gulp 的我的项目都要装一遍吗？

没错，是这样的。因为每个我的项目应用 gulp 的性能不同，版本可能也不一样。这样每个我的项目的 gulp 互相独立。

留神！在装置过程中，因为网速问题，常常导致装置失败。多尝试几次就好

如果装置过程没有呈现任何 Error 提醒，那就没有问题了。

我的项目中多出了一个 node_modules 文件夹，这就是我下载的 gulp 软件？

是的，不要批改、挪动或删除这个文件夹

开始编写 gulp 工作文件

这个工作文件是干什么的？？

简略的说，就是写一个工作列表，通知 gulp 具体要做什么。

比方我当初要压缩我的 js 文件，该怎么编写 gulp 工作文件？

当初，咱们假设我的项目的目录构造是这样的：

src 目录寄存咱们的源文件，dist 目录寄存咱们压缩后的文件

接下来咱们要在我的项目的根目录，创立一个 gulpfile.js 文件

gulpfile.js 文件内容如下：

如果你相熟 nodeJS 那么上面的代码了解起来将会非常容易：

如果你不相熟 nodeJS 那么上面的代码了解起来将会十分吃力：

好了，所有准备就绪，筹备启动 gulp 执行压缩工作

咱们回到命令行，依然在我的项目的根目录下，输出命令 gulp minifyJS

我执行了这个命令，然而碰见了谬误：

Error: Cannot find module 'gulp-uglify'

因为找不到 'gulp-uglify' 这个模块。所以接下来咱们装置它，输出命令 npm install gulp-uglify

等等，不是曾经装置过 gulp 了吗？为什么压缩文件的模块还要独自装置？

gulp 自身不具备压缩文件的性能。它的次要工作，是定义并执行工作。

而工作的具体内容是咱们本人定的，就像 gulpfile.js 文件里写的那样。

为什么 gulp 不把压缩 js 的性能集成进来，这样看来 gulp 其实没什么用了？

恰恰相反，你认真想，如果 Gulp 把性能集成进来，那么它能提供的性能无论如何是无限的

那样做还会让软件体积变大，不须要的性能也必须强制装置。并没有益处。

正是因为 gulp 能够借助任何其它软件来执行工作。实践上来说，gulp 的性能是有限的。

如同有点情理。

好了，接下来咱们再次执行命令 gulp minifyJS

执行了，但又碰见了谬误：

‘gulp’ 不是外部或外部命令，也不是可运行的程序或批处理文件。

这是因为咱们之前把 gulp 装置在了我的项目外面。NodeJS 运行环境并不能辨认 gulp 命令

那怎么办呢？

再把 gulp 全局装置一次 npm install gulp -g

好了，咱们来看看最初生成的成果

dist目录中的文件全部都是压缩过的。

目前，你曾经把握了 Gulp 的原理和最根本用法

Gulp 能够借助其它模块产生无穷无尽的用法，篇幅无限，明天临时只能介绍到这里

如果大家有什么倡议，能够给我留言

我置信，万事 ” 结尾 ” 难，所以接下来你的自学之路，将会无比的顺畅。