获取livereload以使用Sails.js

Question

我是Sails和grunt的新手所以我可能会错过这个明显的东西.我试图在文件发生变化时自动在浏览器中刷新我的风帆应用程序.

我启动应用程序,sails lift它在默认端口上运行1337.

我尝试添加options: {livereload:true}到我的grunt-contrib-watch配置,但据我所知,我需要以某种方式将livereload JavaScript注入我的页面？

我尝试使用注入JavaScript grunt-contrib-connect的livereload选项,但似乎只是启动另一台服务器.当我导航到启动的服务器(localhost:8000)时,我只看到文件夹结构.然而,注入了livereload JavaScript.

如果可能的话,我想避免使用livereload Chrome插件.

将livereload JavaScript注入我的Sails应用程序的最佳方法是什么？或者我应该使用像Browsersync这样的其他工具？

谢谢!:)

Answer 1

1. 将livereload选项添加到tasks/config/watch.js

    module.exports = function(grunt) {

     grunt.config.set('watch', {
        api: {

            // API files to watch:
            files: ['api/**/*', '!**/node_modules/**']
        },
        assets: {

            // Assets to watch:
            files: ['assets/**/*', 'tasks/pipeline.js', '!**/node_modules/**'],

            // When assets are changed:
            tasks: ['syncAssets' , 'linkAssets']
        },
        // ADD THIS 
        options: {
          livereload: true,
        },
    });

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

2. 将livereload脚本添加到布局中,在</body>标记之前的某处,默认情况下添加到views/layout.ejs:

<script src="http://localhost:35729/livereload.js"></script>

除localhost外,您可以使用服务器的IP或DNS名称

如果在api或assets文件夹中更改了文件,这将刷新页面.

默认情况下,Ggrunt-contrib-watch使用35729端口.你可以指点其他端口livereload: 8000

• 类似的问题,但没有那么详细的答案
• Ggrunt-contrib-watch文档

编辑: 嗯,我真的不知道这是否完全正确,但看起来你可以覆盖布局设置config/env/development.js.添加如下内容:

module.exports = {
    views: {
        layout: 'dev'
    }
}

然后,您可以创建单独的布局文件views/dev.ejs,您可以在其中添加livereload脚本和其他开发参数.您也可以livereload以相同的方式添加密钥.