sails.js - 获取 livereload 以使用 Sails.js

Question

我对 Sails 和 grunt 都很陌生，所以我可能会错过明显的东西。
我是尝试在文件更改时在浏览器中自动刷新我的 Sails 应用程序 .

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

我尝试添加 options: {livereload:true}给我的grunt-contrib-watch配置，但据我了解，我需要以某种方式将 livereload JavaScript 注入(inject)我的页面？

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

如果可能，我想避免 livereload Chrome 插件。

将 livereload JavaScript 注入(inject)我的 Sails 应用程序的最佳方法是什么？还是我应该只使用其他工具，例如 Browsersync？

谢谢! :)

Answer 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');
};

将 livereload 脚本添加到您的布局中，在 </body> 之前的末尾某处标签，默认为views/layout.ejs:

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

除了本地主机，您可以使用服务器的 IP 或 DNS 名称

如果 api 或 assets 文件夹中的文件发生更改，这将刷新页面。

默认情况下，Ggrunt-contrib-watch 使用 35729 港口。您可以指向其他端口，例如 livereload: 8000

Similar question, but not so detailed answer

Ggrunt-contrib-watch docs

编辑:
好吧，我真的不知道这是否完全正确，但看起来你可以覆盖 config/env/development.js 中的布局设置.添加类似:

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

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