grunt-contrib-watch ：{ tinylr：“欢迎”，版本：“0.0.4”}答案

【问题标题】：grunt-contrib-watch : { tinylr: "Welcome", version: "0.0.4" }grunt-contrib-watch ：{ tinylr：“欢迎”，版本：“0.0.4”}
【发布时间】：2013-10-30 19:27:36
【问题描述】：

我正在尝试使用 grunt-contrib-watch 和 grunt-contrib-compass 让 grunt 正常工作。

到目前为止，我的 Gruntfile 看起来像这样：

module.exports = function (grunt){

    grunt.initConfig({

    compass : {

        dist : {
        options : {
            debugInfo : 'true'          
        }

        }

    },

    watch : {       
        files : ['*.html', 'js/*', 'sass/*'],
        task : ['compass'],
        options : {
        livereload: true,
        port : 35729
        }       
    }

    });


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

    grunt.registerTask('default', ['watch'])

} ;

我正在使用 chromes live-reload 扩展。

如果我随后运行“grunt -v”，我可以看到 grunt 按预期监视我的 html 和 sass 文件。正如预期的那样，我的浏览器选项卡会自动重新加载。

在浏览器选项卡中，我转到此地址：

http://localhost:35729

但是，在我的浏览器中，我只在加载和重新加载时看到这个：

{
tinylr: "Welcome",
version: "0.0.4"
}

我没有看到我的 index.html。只是对象。

我需要做什么才能看到我的网站？

【问题讨论】：

标签： gruntjs grunt-contrib-watch

【解决方案1】：

http://localhost:35729 是实时重新加载服务器的地址，而不是您的网站。您的网站仍然需要从它自己的地址/端口提供服务，例如http://localhost:8000。通过 grunt-contrib-connect 任务、其他一些 node.js 服务器或一些提供文件 apache/nginx 的服务器。

http://localhost:35729 仅用于将实时重新加载脚本加载到您的页面中：<script src="http://localhost:35729/livereload.js"></script>，然后在更改时将使用网络套接字来触发和更新您网站上的页面。

【讨论】：