grunt插件之connect-livereload

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

安装

npm install connect-livereload --save-dev

使用

注意:如果您使用这个中间件,您应该确保关闭浏览器LiveReload扩展,如果您已安装它。
这个中间件可以与LiveReload模块一起使用,例如grunt-contrib-connect或grunt-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);
        });

}

你可能感兴趣的:(grunt插件之connect-livereload)