今天继续说说gulp的watch,能够自己主动搞定非常多事情。不用每次都去敲命令了!

上次说到用gulp能够非常方便的进行css,js,html的压缩。而且能够对coffee和scss进行编译。

css,js。html一般在公布production时候压缩一次就能够,也就是敲一次gulp命令。可是coffee和scss这两个dev时候会不时修改的文件,假设每次修改完,都须要手动去敲gulp进行编译就有些麻烦了。

那么问题来了。

假设可以每次改完coffee和scss就能自己主动编译成js和css将是一件多么令人happy的一件事情!

Gulp不会让你失望,当然提供了解决方式。那就是watch。

watch事实上比較简单。就是一直监视某些文件是否变了。假设变了,那么进行一些操作。

吃个栗子。

gulp.task('watch', ['coffee'], function(){

gulp.watch('app/assets/coffee/*.coffee', function (event) {

gulp.src(event.path)

.pipe(coffee({bare: true}).on('error', gutil.log))

.pipe(gulp.dest('app/assets/javascripts'));

});

});

已上的代码是自己主动把coffee转js的作用。

意思是。创建一个task,名字叫watch(当然这个名字你随便起)。内容是先运行我自己前面创建的叫coffee的task。

然后进行watch全部的coffee文件。

假设coffee文件有变化,则针对变化的文件。进行一次compile。生成新的js到javascripts文件夹。

就是这么简单。就是这么任性,就是这么强大!

感谢大家看完此篇文章,喜欢的话,请将此篇文章分享到好友圈,或向你的好友推荐, 是对我的最大支持与鼓舞。
另有QQ群: 107584987。

全部技术文章都可在我的CSDN Blog http://blog.csdn.net/tommychen1228 找到

Gulp帮你自己主动搞定coffee和scss的compile的更多相关文章

  1. 重磅教程!帮你全面彻底搞定Material design的学习笔记

    http://www.uisdc.com/comprehensive-material-design-note

  2. sass笔记-1|Sass是如何帮你又快又好地搞定CSS的

    Sass学习笔记持续整理中,开篇不讲怎么安装,sass是什么,这些搜索引擎会告诉你,我们从sass的作用开始讲起,知道sass用来干什么,有什么作用,我们才能相信用sass的好处,并且时时刻刻想着sa ...

  3. 玩转IDEA项目结构Project Structure,打Jar包、模块/依赖管理全搞定

    前言 你好,我是A哥(YourBatman). 如何给Module模块单独增加依赖? 如何知道哪些Module模块用了Spring框架,哪些是web工程? IDEA如何打Jar包?打War包? 熟练的 ...

  4. JS组件系列——又一款MVVM组件:Vue(一:30分钟搞定前端增删改查)

    前言:关于Vue框架,好几个月之前就听说过,了解一项新技术之后,总是处于观望状态,一直在犹豫要不要系统学习下.正好最近有点空,就去官网了解了下,看上去还不错的一个组件,就抽空研究了下.最近园子里vue ...

  5. JS组件系列——BootstrapTable+KnockoutJS实现增删改查解决方案(三):两个Viewmodel搞定增删改查

    前言:之前博主分享过knockoutJS和BootstrapTable的一些基础用法,都是写基础应用,根本谈不上封装,仅仅是避免了html控件的取值和赋值,远远没有将MVVM的精妙展现出来.最近项目打 ...

  6. 3小时搞定一个简单的MIS系统案例Northwind,有视频、有源代码下载、有真相

    一.瞎扯框架.架构 楼主自从1998年从C语言.MASM.Foxbase开始学计算机开始接触这个行当16年以来,2001年干第一份与程序.软件.然后是各种屌的东西开始,差不多干了13年了,这13年来, ...

  7. 一分钟搞定AlloyTouch图片轮播

      一分钟搞定AlloyTouch图片轮播 轮播图也涉及到触摸和触摸反馈,同时,AlloyTouch可以把惯性运动打开或者关闭,并且设置min和max为运动区域,超出会自动回弹.除了一般的竖向滚动,A ...

  8. 如何使用 APM 搞定 PHP 应用的性能优化?

    APM 究竟是什么? 很多人都是第一次听说 APM 的概念,本文主要阐述如何使用 APM 的解决方案来实现 PHP 应用性能的优化.首先先介绍一下 APM (Application Performan ...

  9. 面试大总结:Java搞定面试中的链表题目总结

    package LinkedListSummary; import java.util.HashMap; import java.util.Stack; /** * http://blog.csdn. ...

随机推荐

  1. ACM_尿裤子

    Problem Description: 小X上课的时候喝了一大壶水,午饭后他极限跑回宿舍上厕所,结果发现不知道哪个逗比舍友在宿舍门上加了一把4位密码锁,然后还留了纸条:密码是6666,小X只能一个一 ...

  2. Linux命令(004) -- watch

    对Linux系统的操作过程中,经常会遇到重复执行同一命令,以观察其结果变化的情况.惯用的方法是:上下键加回车,或是Ctr+p然后回车.今天我们来了解一下watch命令,它可以帮助我们周期性的执行一个命 ...

  3. ansible publishing service

    # ansible 初始化服务机 - hosts: newserver vars: - basedir: opt tasks: - name: 安装常用依赖环境 yum: name={{ item } ...

  4. Quartz中时间参数说明 即Cron表达式

    Cron表达式 Quartz使用类似于Linux下的Cron表达式定义时间规则,Cron表达式由6或7个由空格分隔的时间字段组成,如表1所示: 表1 Cron表达式时间字段 位置 时间域名 允许值 允 ...

  5. UVM基础之--------uvm_root

    uvm_root 是uvm的顶层实例扮演了一个top-level and phase controller 的作用,对于component来说.该类不需要用户实例化,他是一个自动实例化了的类,用户直接 ...

  6. JS高级——Function

    Function构造函数 可以用来新建函数对象 1.一个参数都不传的情况创建的就是一个空的函数 2.只传一个参数的情况这个参数就是函数体 3.传多个参数的情况,最后一个参数为函数体,前面的参数都是该函 ...

  7. CSS动画:旋转卡片效果

    <!DOCTYPE html> <html> <head> <title>demo</title> </head> <bo ...

  8. 汇总——WEB前端资源网

    前端攻城师 爱思资源网 HTML5吧 0101后花园 前端网 编程教程和源代码示例 Javascript中文网 Web前端资源网 移动端HTML5资源整理 Web开发者 SegmentFault 前端 ...

  9. LVS部分调度算法的适应场景分析

    1.轮叫调度算法(RR)假设所有服务器处理性能均相同,不管服务器的当前连接数和响应速度.该算法相对简单,不适用于服务器组中处理性能不一的情况,而且当请求服务时间变化比较大时,轮叫调度算法容易导致服务器 ...

  10. mysql_数据查询_连接查询

    连接查询 1.连接(join) 也称θ连接,从两个关系的笛卡尔积中选择属性间满足一定条件的元组. 等值连接:θ为“=”的连接运算称为等值连接.从关系R和S的广义笛卡尔积中选取A.B属性值相等的元组. ...