node.js - 使用 node.js 应用程序进行 Grunt livereload

标签 node.js yeoman gruntjs livereload

我在 Node.js 中编写了一个应用程序(使用 Express 和 socket.io),我想在开发和连接到 Node.js 应用程序时使用 Grunt 通过 livereload 编译我的客户端内容。我该怎么做?(由于路径和跨域问题,最好不要在另一个端口运行 Node.js 应用程序和在另一个端口运行客户端)

我还安装了 Yeoman,它使用的是开箱即​​用的 grunt-contrib-livereload 包,但据我了解,它使用 Node.js Connect 服务器来提供客户端文件,因此与我的 Node.js 应用程序分离。 .

Yeoman 生成的 Gruntfile.js 示例:

var lrSnippet = require('grunt-contrib-livereload/lib/utils').livereloadSnippet;
var mountFolder = function (connect, dir) {
    return connect.static(require('path').resolve(dir));
};

// ... cut some parts
grunt.initConfig({
    watch: {
        livereload: {
            files: [
                '<%= yeoman.app %>/*/*.html',
                '{.tmp,<%= yeoman.app %>}/styles/*.css',
                '{.tmp,<%= yeoman.app %>}/scripts/*.js',
                '<%= yeoman.app %>/images/*.{png,jpg,jpeg}'
            ],
            tasks: ['livereload']
        }
        // ..cut some parts
    },
    connect: {
        livereload: {
            options: {
                port: 9000,
                middleware: function (connect) {
                    return [
                        lrSnippet,
                        mountFolder(connect, '.tmp'),
                        mountFolder(connect, 'app')
                    ];
                }
            }
        }
    }
    // ..cut some parts
});

grunt.registerTask('server', [
    'clean:server',
    'coffee:dist',
    'compass:server',
    'livereload-start',
    'connect:livereload',
    'open',
    'watch'
]);

最佳答案

不确定您是否已经解决了这个问题,但我已通过将我的 express 应用程序添加为附加到“connect.livereload.options.middleware”选项的中间件来完成此操作。

但是,服务器端代码的自动重新加载不起作用。为此,您可以使用简单的“node ./server.js”实现一个重新加载友好的服务器,创建一个连接中间件作为您的开发服务器的透明代理,并在您的标准连接/livereload 之前在您的 Gruntfile.js 中调用它服务器启动。

connect: {
    options: {
        port: 9000,
        // change this to '0.0.0.0' to access the server from outside
        hostname: 'localhost'
    },
    livereload: {
        options: {
            middleware: function (connect) {
                return [
                    lrSnippet,
                    mountFolder(connect, '.tmp'),
                    mountFolder(connect, 'app'),
                    require('./server') // your server packaged as a nodejs module
                ];
            }
        }
    }
}

server.js:

var app = express();

...
// Export your server object.
module.exports = app;

关于node.js - 使用 node.js 应用程序进行 Grunt livereload,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/14976839/

相关文章:

javascript - 使用 Ajax、jquery、Node.js 和 Express POST 数据

node.js - 如何查询 mongoDB 以获取其 _id 值与数组中的一个 _id 值匹配的文档?

node.js - 如何使用 Node.Js 在 MongoDB 中插入或更新数组?

Javascript - 从多个集合中从 mongodb 收集数据然后合并到数组中

javascript - 失败 $ grunt buildcontrol :pages jit-grunt Not Found

javascript - 我可以使用源映射将 .less 更改为 a.min.css 并且仍然能够在开发工具中查看 .less 文件吗?

angularjs - 使用 yo Angular 脚手架时无法获取/

javascript - 如何运行使用 yeoman 创建的 AngularJS 应用程序

javascript - 防止 jshint 警告 "Expected ' {' and instead saw ' 返回'。”

node.js - 全局 NPM 模块无法在 OS X Mountain Lion 上运行