####前言css
还记得过年前的那篇介绍grunt.js
的文章,grunt.js
的强大,相信你们都见识了。年后打了两天的酱油,看了很多grunt.js
的插件和教程。发现了一个号称比grunt.js
要好的构建工具
- gulp.js
,详细简介gulp.js。网上有不少比较grunt.js
和gulp.js
的文章。谈论到的不外乎如下几点:html
gulp.js
比grunt.js
要简单。设置gulpfile.js
就和编写代码同样,而不像Gruntfile.js
的配置文件。(这个我十分认同,gulp.js
确实比grunt.js
易上手,并且gulpfile.js
比Gruntfile.js
也更好阅读。)node
gulp.js
是“流式”的,比grunt.js
执行效率更高,运行速度更快。(这个我也认同,一样的执行browserSync
和sass
任务,gulp.js
的运行速度明显要更快。)git
####推荐程序员
上文介绍到的browserSync
和sass
都是十分好用的东东github
Sass
,这个应该不用多说了吧,做为第一个css
预处理器,至今也拥有超高人气,配合compass
一块儿使用,神器!!!!与之齐名的还有Less
,二者语法类似,也很好学。这里有两篇很好的入门指南: Sass、Compass。(这里提醒一下,因为Sass
是基于ruby
的,通常来讲使用Sass
要先安装ruby
(因为Sass
的强大和node.js
的流行,大神们造出了node-sass
,node-sass)。)npm
browserSync
,这个是比较新的调试工具,一个插件就实现了我上一篇文章捣鼓了一下午的livereload
功能,并且这玩意还有十分牛X的功能就是:gulp
多浏览器同步调试,想象一下:你的工做台上面有不少移动设备配合你作多屏适应,你只须要保存代码,全部设备都会自动刷新,并且在一个设备作点击,滚动等操做,其余设备也会同步响应,酷炫!browserSync
运行起来后,会有一个可视化设置页面,能够管理调试设备和调试功能,并且,它居然还内置了weinre
,只须要一个按钮就能够打开weinre
调试功能。(可是我暂时只能在本地环境能使用到weinre
的调试功能,移动设备还须要进一步研究。感谢富华同窗发现的这个插件!)segmentfault
####Gulp.jswindows
其实嘛,学习新的东西,最好仍是去官网看文档。因此我就不在这里班门弄斧了,你们都是聪明人。这里给你们一个连接: Gulp.js。gulp.js
原本就很容易上手,这篇教程也很高质量,配合一下gulp.js
的官方文档和gulp.js
相关插件的文档,easy job!
####最后
相信之后能打酱油的日子愈来愈少了,这些日子里,学到了很多实用的东西,包括程序员必学的git
,推荐给你们一个很好的学习git
的途径:学着建一个Github Pages
,这是Github
提供的创建我的主页,项目主页的功能,代码都是托管在Github
,免费并且还有我的域名。须要用到jekyll
,jekyll
又须要用到ruby
,这里有一个大坑,ruby
和gem
都是OS X
自带的,在OS X
下直接gem install jekyll
一帆风顺,可恶的是在windows
下,编译jekyll
又须要ruby
的devkit
,要安装好jekyll
,请下载ruby
2.0.0 版本的不要用 1.9.3 或 2.1.5 ,亲身惨痛经历!
若是你们对gulp.js
设置有问题,能够看一下我上传的Github