首页 > Web开发 > 详细

webpack踩过的坑

时间:2020-12-20 10:42:40      阅读:36      评论:0      收藏:0      [点我收藏+]
环境:

IE 11
vue ^2.6.12

webpack ^5.11.0
webpack-dev-server ^3.11.0
babel ^7.12.10

问题一:开发模式下,chrome 上正常,IE11 上白屏并有报错信息 SCRIPT1002: 语法错误

技术分享图片

【解决】

技术分享图片

问题二:Invalid Host/Origin header

模块热替换,chrome 上正常,IE11 上异常并且控制面板持续报错

技术分享图片

【问题定位】

新版的 webpack-dev-server 出于安全考虑,默认检查 host,如果没有配置 host,将中断访问。
所以,方法一是配置 host
当然,在我们的开发环境下,也可以通过禁用掉 disableHostCheck 这一配置,处理这个问题。

devServer: {
  host: ‘127.0.0.1‘, // 方法一
  disableHostCheck: true, // 方法二
},

问题三:模块热替换失效,浏览器页面没有自动更新

github上相关 issue

技术分享图片

【解决】设置 target: ‘web‘

webpack.config.js

{
...
mode: ‘development‘,
target: ‘web‘,   // 设置target
...
}

webpack踩过的坑

原文:https://www.cnblogs.com/uakora/p/14162311.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!