文章详情页
javascript - VUEX如何配合webpack使用热重载?如何实现CSS热重载?
浏览:122日期:2023-02-20 08:22:54
问题描述
使用webpack-dev-server来开发现在想保持vuex的状态来更新CSS,
如果使用 webpack-dev-server --hot 可以保持状态但只能更新js, css修改了没反应(.vue文件里面)如果使用 webpack-dev-server --inline 可以更新CSS,但不能保持状态
求解!
问题解答
回答1:自问自答:问题出在开发环境我用了extract-text-webpack-plugin抽出了CSS,由于浏览器的缓存(可能原因)导致CSS的更改没有传递给浏览器。
因此解决办法就是直接将CSS输出到HTML里的style标签,这样CSS的热重载就生效了(保持VUEX状态)。也不需要vue-hot-reload-api,vue-loader自带了。
有一点疑问,为什么js也是抽出来单独一个文件,但却支持热重载,没有缓存的问题,然而CSS却有。我觉得可能与vue-loader的热重载底层实现有关。
回答2:可以参考我的这篇博客:
http://ewind.us/2017/webpack-...
NPM 命令采用 webpack-dev-server --hot --inline 即可。另外记得添加 vue-hot-reload-api 依赖。
标签:
JavaScript
上一条:javascript - var x = "[{’a’:’xx’},{’b’:’xxx’}]";如何在js中解析成json对象下一条:javascript - jquery怎么让a标签跳转后保持tab的样式
相关文章:
1. docker gitlab 如何git clone?2. java报错Communications link failure 该如何解决?3. android - 项目时间长了,字符串文件strings有的字符串可能是多余的,有没有办法快速检测那些是没用的?4. javascript - 怎么看网站用了什么技术框架?5. mysql - 用PHPEXCEL将excel文件导入数据库数据5000+条,本地数据库正常,线上只导入15条,没有报错,哪里的问题?6. angular.js使用$resource服务把数据存入mongodb的问题。7. 刷新页面出现弹框8. 关于Android权限的获取问题,大家遇到过这样的情况嘛?9. angular.js - angularJs ngRoute怎么在路由传递空字符串及用ng-switch取得10. PC 手机兼容的 编辑器
排行榜
