開門見山，直接貼 repo 位置 https://github.com/gcaaa31928/webpack-hot-socketio 前言 webpack 使用 hot reload 技術時，通常都需要 webpack-dev-server 或是 webpack-hot-middleware 來搭配 express 或是 koa，才能使用 hot reload 的功能。 而這其實對 large scale 的 projects 並不公平，因為 serve large scale projects 的 website，通常都使用自己的方式來 serve 整個 website，如 nginx, apache。 如果要用 webpack-dev-server 來搭配這個 large scale solution 實在是很麻煩，也就因為這樣，才會誕生了 webpack-hot-socketio。 但為了啟用 hot reload 的效果，我們還是得啟用一個 socket.io server，詳細可看 https://github.com/gcaaa31928/webpack-hot-socketio 中的 example 技術內幕 其實也沒什麼內幕，只是把 webpack-hot-middleware 拿出來改一改，原本 webpack-hot-middleware 是用 server-sent 來達到從伺服器端發送事件的效果，詳細可看 https://developer.mozilla.org/zh-TW/docs/Web/API/Server-sent_events/Using_server-sent_events 而 webpack-hot-socketio 則是利用 socket.io 來做伺服器端發送的效果，過程當中遇到許多問題，例如當 socket.io server 重啟時會導致送出多餘的 hot update.json，而讓網頁以為自己沒有更新到 hot update 的 hash 而遞迴崩潰，這時候就非常需要看懂 hot module 的 code 了 QQ。 注意事項 由於 host 的位置一定與 socket.io server 的 host 或是 port，不同，所以有極大