Question

我希望我的节点应用程序在文件更改时自动刷新浏览器（无外部应用程序）。

我想避免使用webpack dev服务器，因为它不允许我使用自己的koa服务器，而且通常很麻烦。

如何在文件更改时自动刷新浏览器？

Answer 1

尝试使用https://github.com/TomGrill/gdx-dialogs：

<强> KOA-app.js ：

/.../
var watchr = require('watchr');
watchr.watch({
    paths: [__dirname], listeners: {
        change: function() {
            // Emits an event to all connected clients 
            io.sockets.emit('browserReload');
        }
    }
})

<强>客户side.js ：

  /.../
  socket.on('browserReload', function () {
     // Reload without using cache
     document.location.reload(true);
  });

Answer 2

所以我想通了。

事实证明，koa-socket的API可能适用于某些人，但它通常是一堆不必要的臃肿。另外，观看这个过程很棒，但如果你已经有节点脚本这样做，那就多余了，并且会破坏你的代码。

我最后用一些非常简单的代码将socket.io附加到我的Koa服务器上：

<强> server.js

var app = require('koa')();
var server = require('http').createServer(app.callback());
var io = require('socket.io')(server);
io.on('connection', function(){ /* … */ });
server.listen(3000);

这很有效。下一步是连接到客户端上的Koa服务器。那段代码也很简单：

<强> client.js

var socket = require("socket.io-client")("http://localhost:3000");

所以现在socket.io正在我的服务器上工作，客户端可以连接到它。由于节点包和脚本（如supervisor / nodemon），我的服务器在任何文件更改时都重新启动。

下一步很简单：当文件发生更改时，服务器重新启动，当服务器重新启动时，会向所有强制页面重新加载的客户端发出socket.io事件。代码看起来像这样：

<强> server.js

var serverRestarted = true;

if (serverRestarted === true) {
    io.emit("browserReload");
    serverRestarted = false;
}

<强> client.js

socket.on("browserReload", function() {
    document.location.reload(true);
});

就是这样。当然，使用无法正常工作的软件包或对API进行无证的更改是一种痛苦，我曾经习惯使用...所以我没有使用它们。

我最终得到的东西在开发过程中效果很好。

节点：在文件更改时自动刷新浏览器

2 个答案: