重现步骤
我有一个使用webpack模板从vue-cli引导的应用程序.我在Chrome 65.0.3325.146上运行它,但它也存在于64.X.XXX版本上.
我在这里添加：
package.json:https://gist.github.com/marcinlesek/a7e6076ce4befe2e810743fdbaf81480
webpack.base.conf.js：https://gist.github.com/marcinlesek/80cbf27b6ef4172248709f32c257d0cd
有什么期待？
该应用程序应该适用于Chrome浏览器,我应该可以在Chrome开发工具中禁用/更改样式.
究竟发生了什么？
当我通过Chrome开发工具更改样式时,它破坏了所有样式(在更改或禁用一个属性之后),该页面看起来像纯HTML,没有任何样式代码行.新的开发工具设置和Chrome重新安装没有帮助.有点棘手,在Firefox 58.0.2上一切正常.
我的同事也有这个问题,所以它让我相信这不是我的本地错误,而是Vue方面更大的东西.还可以找到有关此错误的一些问题,例如Page styles break when I change styles in Chrome DevTools with Webpack HMR
提前致谢.
最好的祝福,
马尔钦
最佳答案
我也遇到过这个问题,我可以通过在开发中禁用CSS源映射来防止这种情况.我仍在调查为什么这只发生在Chrome上,但至少我们可以开始寻找它.我不相信这是一个Webpack问题.
– 更新 –
我只是在我的config / index.js文件中将devtool更改为“eval-source-map”,一切正常.
file: config/index.js
...
// https://webpack.js.org/configuration/devtool/#development
devtool: 'eval-source-map'
...
