其实这篇内容已躺在我的Evernote里许久，但一直搁置着，今天算是正式见光。

本文主要介绍如何使用Gulp.js，来帮助你构建一个自动化的前端开发流程。总结并归类自身使用中所遇到的方法、问题，便于新人上手和理解，同时也作为一份Gulp参考文档来使用，让你对Gulp有个更深入的了解。

最后，在正文开始前给新人提个醒：随着Gulp版本更新，API已发生了细小变化，目前网上很多文章，都是基于早期版本所写，当你查阅资料时一定要留意一下，否则会给你带来不少麻烦。

注：
本文所使用的工具版本为：Node.js（v0.10.21）、 Ruby（v2.2.1p85）、Gulp（v3.8.11）。
如有疑问欢迎在本文下方留言，或关注我的个人微信号：bluesdream_com
[ 查看全文... ]

苦B的前端每次在制作和修改页面时，都有一个特定的三部曲：coding-save-F5。很多时候都希望自己一改东西，页面就能立刻显示，而现在LiveReload就能做到这点。

LiveReload会监控你指定的目录中文件，如果有文件被更改，它就自动触发浏览器刷新页面。但如果你修改的是CSS或者图片，页面内容会即时更新，无需重新加载。这样我们不用每次修改文件后，都要去按下F5刷新页面，而是直接就能显示，有点类似所见即所得的编辑模式，特别适合使用双屏coding的人。另外同时结合Sublime text和Emmet LiveStyle，能提高不少开发效率。

LiveReload安装前的准备工作：

安装Node.js和Grunt，如果第一次接触，可以参考：Windows下安装Grunt的指南和相关说明，根据步骤操作，创建完package.json 和 Gruntfile.js这2个文件就行。

接下来，开始配置LiveReload所需要的环境和相关插件。这里所提供的有两种安装方案，根据自己需求进行选择。 [ 查看全文... ]