反应项目实践的网络包开发服务

热模块更换(热模块更换)

HMR是网络包最令人兴奋的功能之一。修改并保存代码后，webpack会重新打包代码并将新模块发送到浏览器。浏览器用新模块替换旧模块，这样就可以在不刷新浏览器的情况下更新应用程序。HMR是一个值得深入研究的东西。它绝不像我们迄今为止所看到的大多数技术文章那样简单地配置一个热参数。感兴趣的伙伴可以看看它的实现原理。到目前为止，我只看到了一点点。

其实实现HMR的插件很多，webpack-dev-server只是其中一个，当然也是一个优秀的，可以很好的配合webpack。此外，webpack-dev-server仅用于开发环境。

Webpack-dev-server是一个小型的静态文件服务器，它为Webpack打包的资源文件提供web服务。并提供自动刷新和Hot Module Replacement(Hot Module Replacement:前端代码更改后，不需要刷新整个页面，只需替换更改的部分)。

(1)安装

Npm安装web包-开发-服务器-保存-开发(2)配置

修改webpack.config.js，添加devServer的配置

devserver 3360 { contentbase : }。/dist '，port: 3000，//默认8080host:' localhost '，inline 3360 true//实时刷新}，webpack-dev-server支持两种自动刷新模式：

内嵌模式

修改package.json并添加脚本脚本开始：“start”:“web pack-dev-server-open”

此时，在命令行输入npm start，浏览器会自动打开页面。

修改页面内容并保存，实时刷新页面。

以上就是本文的全部内容。希望对大家的学习有帮助，支持我们。