工作上遇到个后台的项目,express + vue 写的,用了Webpack Hot Middleware配合webpack-dev-middleware来让客户端连接到客户端,使用nodemon来监听重启服务器。但是webpack打包前端静态资源的速度还是比较慢的,每一次对server端的改动都要等待重新打包,但客户端的文件其实并没有改动,这么做就浪费了时间。所以,想摸索一下服务器端热加载的方法,不再用nodemon监听,在改动server端代码的时候,前端该干嘛干嘛,不要掺和进来重新打包了。
想法来源
node.js的模块加载机制是commonjs的,与es6的export/import有所区别。虽然babel可以把它转成es6的语法,但本质不变。可以通过删除require.cache来去除缓存的node module。
仿照了这个实例ultimate-hot-reloading的思路,不过例子的文件结构很简单,实际项目中模块引用可能一层套一层的,还是有些地方需要注意。
基本思路
- 监听文件变动(chokidar, fs.watchFile)
使用chokidar来监听文件的变动 - 在变动的范围内去缓存decache ,可以采用插件如