Watch is an essential component of any Grunt build, and you will find yourself using it in almost every project.

How to install?


1. Install grunt first if you don't have yet. Check the first article for Grunt.

2. Install grunt-contrib-watch

npm install grunt-contrib-watch

What is watch used for?


A simple example is that, it can watch a file if the file changed then trigger the task to run.

How to use?


You have a log.txt file, and you want to watch this file.

1. load npm task:

grunt.loadNpmTasks('grunt-contrib-watch');

2. set up watch:

    grunt.initConfig({
watch: {
files: ['log.txt'],
tasks: ['pat']
}
});

3. add task:

    grunt.registerTask('pat', function(){
grunt.log.writeln('I am watching you!');
});

4. Start watch:

#In cmd

$ grunt watch

File the file is modified:

[Grunt] Watch && grunt-contrib-watch的更多相关文章

  1. 杂项-Grunt:grunt build 打包和常见错误

    ylbtech-杂项-Grunt:grunt build 打包和常见错误 1. 安装.打包返回顶部 1. npm WARN deprecated coffee-script@: CoffeeScrip ...

  2. 【grunt】grunt 基础学习

    1. 干啥的呢? 项目打包管理,用处有 1)可用于压缩合并前端文件,包括css/js , 2)可用于管理发布文件与开发文件,3)可用于自动编译less 文件 2. 常用的东西有哪些呢? 常用的插件有 ...

  3. 用grunt搭建自动化的web前端开发环境实战教程(详细步骤)

    用grunt搭建自动化的web前端开发环境实战教程(详细步骤) jQuery在使用grunt,bootstrap在使用grunt,百度UEditor在使用grunt,你没有理由不学.不用!前端自动化, ...

  4. grunt api 文档

    Grunt docs Grunt和 Grunt 插件是通过 npm 安装并管理的,npm是 Node.js 的包管理器. 安装 grunt-cli npm install grunt-cli -g 注 ...

  5. 前端工程化系列[03]-Grunt构建工具的运转机制

    在前端工程化系列[02]-Grunt构建工具的基本使用这篇文章中,已经对Grunt做了简单的介绍,此外,我们还知道了该如何来安装Grunt环境,以及使用一些常见的插件了,这篇文章主要介绍Grunt的核 ...

  6. grunt配置任务

    这个指南解释了如何使用 Gruntfile 来为你的项目配置task.如果你还不知道 Gruntfile 是什么,请先阅读 快速入门 指南并看看这个Gruntfile 实例. Grunt配置 Grun ...

  7. 快速开发Grunt插件----压缩js模板

    前言 Grunt是一款前端构建工具,帮助我们自动化搭建前端工程.它可以实现自动对js.css.html文件的合并.压缩等一些列操作.Grunt有很多插件,每一款插件实现某个功能,你可以通过npm命名去 ...

  8. 应用Grunt自动化地优化你的项目前端

    在不久前我曾写了一篇 应用r.js来优化你的前端 的文章,为大家介绍了r.js这个实用工具,它可以很好地压缩.合并前端文件并打包整个项目.但是如果将r.js放到项目中,我们不得不顾及到一个问题——项目 ...

  9. Grunt基本使用-V1.0

    浅语:grunt中文网:http://www.gruntjs.net/ 第一步:Grunt 依赖 Node.js 所以在安装之前确保你安装了 Node.js.然后开始安装 Grunt. 实际上,安装的 ...

  10. 前端打包构建工具grunt快速入门(大篇幅完整版)

    打包的目的和意义就不用叙述了直接上干货 http://www.gruntjs.net/getting-started里面的教程也太简单了,需要下一番功夫去研究才行.本文将grunt打包的常用方法都用实 ...

随机推荐

  1. ZXing.Net.Mobile无法识别较大的条码

    ZXing.Net.Mobile无法识别较大的条码 在Xamarin项目中,使用ZXing.Net.Mobile实现条码扫描时,可能会出现无法顺利识别较大的条码,而可以正常识别较小的条码.这是由于ZX ...

  2. 莫队p2 【bzoj3809】Gty的二逼妹子序列

    发现一篇已经够长了...所以就放在这里吧... http://hzwer.com/5749.html ↑依然是看大牛题解过的   袜子那道题太简单了.... 然后被这道题超时卡了一段时间....... ...

  3. BZOJ2754 [SCOI2012]喵星球上的点名 SA+莫队+树状数组

    题面 戳这里 题解 首先先把所有给出的姓名和询问全部接在一起,建出\(height\)数组. 某个串要包含整个询问串,其实就相当于某个串与询问串的\(lcp\)为询问串的长度. 而两个后缀\(Suff ...

  4. 【树链剖分/倍增模板】【洛谷】3398:仓鼠找sugar

    P3398 仓鼠找sugar 题目描述 小仓鼠的和他的基(mei)友(zi)sugar住在地下洞穴中,每个节点的编号为1~n.地下洞穴是一个树形结构.这一天小仓鼠打算从从他的卧室(a)到餐厅(b),而 ...

  5. OpenAPI安全防护

    1,开放API可能存在的数据安全问题 (1)数据窃取 通常体现为:钓鱼网站,拦截,伪装,截包 (2)数据篡改 中间被拦截,以代理的方式拦截数据,修改数据 (3)数据泄露 爬虫抓取核心数据 2,解决数据 ...

  6. php获取开始与结束日期之间所有日期的方法

    /** * 获取指定日期段内每一天的日期 * @param Date $startdate 开始日期 * @param Date $enddate 结束日期 * @return Array */ fu ...

  7. GNU诞生三十周年

    1983年9月27日,MIT人工智能实验室的Richard Stallman在新闻组宣布了雄 心勃勃的GNU(Gnu's Not Unix)操作系统计划,他计划创造一个Unix兼容的自由软件系统,包含 ...

  8. JavaScript中数组的各种操作方法

    [监测数组] 使用instanceof操作符,进行检测 ar arr = [1,2,3]; // arr = '非非'; if(arr instanceof Array){ console.log(' ...

  9. 采集音频和摄像头视频并实时H264编码及AAC编码[转]

    0. 前言 我在前两篇文章中写了DirectShow捕获音视频然后生成avi,再进行264编码的方法.那种方法有一些局限性,不适合实时性质的应用,如:视频会议.视频聊天.视频监控等.本文所使用的技术, ...

  10. UVa 1329 - Corporative Network Union Find题解

    UVa的题目好多,本题是数据结构的运用,就是Union Find并查集的运用.主要使用路径压缩.甚至不须要合并树了,由于没有反复的连线和改动单亲节点的操作. 郁闷的就是不太熟悉这个Oj系统,竟然使用库 ...