使用webpack-dev-server来开发现在想保持vuex的状态来更新CSS,
webpack-dev-server
如果使用 webpack-dev-server --hot 可以保持状态但只能更新js, css修改了没反应(.vue文件里面)如果使用 webpack-dev-server --inline 可以更新CSS,但不能保持状态
webpack-dev-server --hot
.vue
webpack-dev-server --inline
求解!
闭关修行中......
自问自答:问题出在开发环境我用了extract-text-webpack-plugin抽出了CSS,由于浏览器的缓存(可能原因)导致CSS的更改没有传递给浏览器。
extract-text-webpack-plugin
因此解决办法就是直接将CSS输出到HTML里的style标签,这样CSS的热重载就生效了(保持VUEX状态)。也不需要vue-hot-reload-api,vue-loader自带了。
vue-hot-reload-api
vue-loader
有一点疑问,为什么js也是抽出来单独一个文件,但却支持热重载,没有缓存的问题,然而CSS却有。我觉得可能与vue-loader的热重载底层实现有关。
可以参考我的这篇博客:
http://ewind.us/2017/webpack-...
NPM 命令采用 webpack-dev-server --hot --inline 即可。另外记得添加 vue-hot-reload-api 依赖。
webpack-dev-server --hot --inline
自问自答:
问题出在开发环境我用了
extract-text-webpack-plugin
抽出了CSS,由于浏览器的缓存(可能原因)导致CSS的更改没有传递给浏览器。因此解决办法就是直接将CSS输出到HTML里的style标签,这样CSS的热重载就生效了(保持VUEX状态)。也不需要
vue-hot-reload-api
,vue-loader
自带了。有一点疑问,为什么js也是抽出来单独一个文件,但却支持热重载,没有缓存的问题,然而CSS却有。我觉得可能与vue-loader的热重载底层实现有关。
可以参考我的这篇博客:
http://ewind.us/2017/webpack-...
NPM 命令采用
webpack-dev-server --hot --inline
即可。另外记得添加vue-hot-reload-api
依赖。