错误1:找不到__webpack_hmr
在webpack的entry配置添加引用路径'webpack-hot-middleware/client?path=/__webpack_hmr&timeout=10000&reload=true',相关的参数最好不要省略,否则会出现无法自动刷新的问题。
处理脚本如下:
entries.forEach((key) => {
wpConfig.entry[key].push(hotMiddlewareScript);
})
// 添加插件信息
if(wpConfig.plugins === undefined) {
wpConfig.plugins = []
}
// 添加热加载插件
wpConfig.plugins.push(
new webpack.optimize.OccurrenceOrderPlugin(),new webpack.HotModuleReplacementPlugin(),new webpack.NoEmitOnErrorsPlugin())
错误2:找不到hot-update.json
webpack配置中的publicPath必须是绝对地址,详细配置如下所示:
错误3:No ‘Access-Control-Allow-Origin' header
不可思议,在本地访问竟然会出现AJAX跨域问题,仔细检查后发现,浏览器把localhost与127.0.0.1当成了两个不同的域,解决的方法很多,只说最简单的一种,访问应用时,尽量采用与webpack配置中的publicPath完全一致的路径,如在本文中,最好的访问方法是输入http://127.0.0.1/访问本地应用。
错误4:OccurenceOrderPlugin构造器错误
此问题一般出现在webpack 2中,解决办法很简单,将OccurenceOrderPlugin改为OccurrenceOrderPlugin即可。
总结
webpack编译程序有两种热加载方式,webpack-dev-server与webpack-hot-middleware方式,从webpack 2的性能来看,webpack-dev-server完全能够满足开发的需要,但最大的问题在于,webpack-dev-server不能向外发布服务,只能在本地访问。
以上这篇基于webpack-hot-middleware热加载相关错误的解决方法就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持编程之家。
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。