grunt-contrib-watch:{tinylr:"欢迎",版本:"0.0.4"}

Question

我正在努力工作,使用grunt-contrib-watch和grunt-contrib-compass.

到目前为止,我的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.只是对象.

为了查看我的网站,我需要做什么？

Answer 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>然后在更改时将使用Web套接字触发并更新您网站上的页面.