grunt插件之connect-livereload

连接中间件,将livereload脚本添加到响应中。不需要浏览器插件。如果您对浏览器插件感到满意,那么您不需要这个中间件。

安装

npm install connect-livereload --save-dev

使用

注意:如果您使用这个中间件,您应该确保关闭浏览器LiveReload扩展,如果您已安装它。
这个中间件可以与LiveReload模块一起使用,例如grunt-contrib-connectgrunt-contrib-watch

connect-livereload本身不服务于livereload.js脚本。

'use strict'; 
var lrSnippet = require('connect-livereload')({port:35729});
var serveStatic = require('serve-static'); //加载serve-static模块,设置静态文件服务器的路径
var serveIndex = require('serve-index');//加载serve-index模块,启用目录浏览

module.exports=function (grunt) {
    require('load-grunt-tasks')(grunt); 
    require('time-grunt')(grunt)
    
    var config={
        app:'app',  
        dist:'dist', 
        tmp:'.tmp'    
    };

    grunt.initConfig({
        project:config,
        watch:{
            html:{
                files:['<%=project.dist%>/*.html'],
                options:{
                    livereload: 35729
                }
            }
        },

        connect:{
            dist:{
                options:{
                    port:9001,
                    base:'dist',
                    open:true,
                    middleware:function (connect) {
                        return [
                           // 把脚本,注入到静态文件中
                           lrSnippet,
                           // 静态文件服务器的路径
                           serveStatic('dist'),
                           // 启用目录浏览(相当于IIS中的目录浏览)
                           serveIndex('dist')
                        ];

                    }
                }
            }
        }


    })

    //注册一个名为'serve', 输入grunt serve执行这个任务
    grunt.registerTask('serve','Compile then start a connect web server',function (target) {
        if(target === 'dist'){

        }else if (target === 'static'){

        }

        grunt.task.run([
                
                'connect',
                'watch'
            ])
    });

    grunt.event.on('watch', function(action, filepath, target) {
          grunt.log.writeln(target + ': ' + filepath + ' has ' + action);
          grunt.log.writeln('action='+action);
          grunt.log.writeln('filepath='+filepath);
          grunt.log.writeln('target='+target);
        });

}

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 215,539评论 6 497
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 91,911评论 3 391
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 161,337评论 0 351
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 57,723评论 1 290
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 66,795评论 6 388
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 50,762评论 1 294
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 39,742评论 3 416
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 38,508评论 0 271
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 44,954评论 1 308
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 37,247评论 2 331
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 39,404评论 1 345
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 35,104评论 5 340
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 40,736评论 3 324
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 31,352评论 0 21
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 32,557评论 1 268
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 47,371评论 2 368
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 44,292评论 2 352

推荐阅读更多精彩内容

  • 启动一个web服务器连接 启动任务 使用grunt connect命令运行此任务。 请注意,只有grunt正在运行...
    angelwgh阅读 1,405评论 0 0
  • Spring Cloud为开发人员提供了快速构建分布式系统中一些常见模式的工具(例如配置管理,服务发现,断路器,智...
    卡卡罗2017阅读 134,647评论 18 139
  • 当文件被添加、更改或删除时,运行预定义的任务 安装插件 安装完插件后,可以在Gruntfile中用这行代码启用插件...
    angelwgh阅读 2,988评论 0 1
  • 一:LoadRunner常见问题整理1.LR 脚本为空的解决方法:1.去掉ie设置中的第三方支持取消掉2.在系统属...
    0100阅读 4,116评论 0 11
  • 在人生已步入中年,可人们口中成功人士的有房有车有存款,我却是没车没存款,就连住的房子还是父母以前盖的老房子。 在如...
    梅启林阅读 309评论 0 0