如何通过grunt+swig实现自动化?

情况是这样的,自己在做练习,想使用swig模板,通过grunt + livereload来实现自动化。

首先我先设置了端口号为80

var port = normalizePort(process.env.PORT || '80');
var server = http.createServer(app);
server.listen(port);

同时也设置了默认请求

var index = require('./routes/index');
app.use('/', index);

这样在直接访问地址的时候,已经可以直接访问到index.html了,但是想通过grunt + livereload来实现自动化。
这样就用到了watch

/*  部分代码 */
watch: {
    html:{
        options:{
            livereload:{
                port: 80
            }
        },
        files:['views/**/*.html']
    }
}

也设置了grunt的default任务,执行grunt成功。
但是修改html文件,并不会实时生效,但是如果重启server就能生效了,这样我又想到加入shell。

shell:{
    run:{
        command:'node server.js --inline'
    },
    killall:{
        command:'killall node'
    }
}

watch: {
    html:{
        options:{
            livereload:{
                port: 80
            }  //livereload工具,浏览器安装插件后,不用重启服务器,不用刷新页面,好神奇的说
        },
        files:['views/**/*.html'], //如果swig的文件有变化,就执行任务
        tasks:['shell:run']
    }
}

但是还是不行,希望大家能给点儿帮助,谢谢。

另外请问一下,对livereload设置端口,到底有什么用呢?

阅读 3.4k
1 个回答

grunt watch livereload
查看 enabling live reloading in your html

为什么能自动刷新网页。其实就是你的服务器起了一个TCP/TLS Server,并监听一个端口。网页livereload脚本与这个端口建立连接,当服务器文件发生变化,服务器向通知浏览器执行刷新命令,这样你可以尝试如何让HTTPS的服务器也能够实现自动刷新。

撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题