webpack-dev-server 和webpack-hot-middleware

webpack-dev-server

webpack-dev-server实际上至关于启用了一个express的Http服务器+调用webpack-dev-middleware。它的做用主要是用来伺服资源文件。这个Http服务器和client使用了websocket通信协议，原始文件做出改动后，webpack-dev-server会用webpack实时的编译，再用webpack-dev-middleware将webpack编译后文件会输出到内存中。适合纯前端项目，很难编写后端服务，进行整合。

 

webpack-dev-middleware

 webpack-dev-middleware输出的文件存在于内存中。你定义了 webpack.config，webpack 就能据此梳理出entry和output模块的关系脉络，而 webpack-dev-middleware 就在此基础上造成一个文件映射系统，每当应用程序请求一个文件，它匹配到了就把内存中缓存的对应结果以文件的格式返回给你，反之则进入到下一个中间件。

由于是内存型文件系统，因此重建速度很是快，很适合于开发阶段用做静态资源服务器；由于 webpack 能够把任何一种资源都看成是模块来处理，所以能向客户端反馈各类格式的资源，因此能够替代HTTP 服务器。

 

两者的区别仅在于 webpack-dev-server 是封装好的，除了 webpack.config 和命令行参数以外，很难去作定制型开发。而 webpack-dev-middleware 是中间件，能够编写本身的后端服务而后把它整合进来，相对而言比较灵活自由。