热更新踩坑

每次配置webpack的时候都会遇到一些问题，运行到都没有什么问题了，就是一个功能总是让人老火，出毛病。这不上个星期有重新写了一个webpack的配置。因为只是在开始一个项目的时候才会配置它，也就是不会经常研究和写它。所以对这个玩意运用的也不是那么有掌握。大部分都是在网上找问题，还有就是反复的实验，这两个过程既费时间也很头疼。

关于热更新：

在设置devServer属性的时候，一定得开启热跟新 hot:true ，不然就算是css也不会更新的。

还有在使用html-webpack-plugin自动注入html、css、js的时候，注意得把生成的html直接放在dist目录下面，也就是服务器根目录的下面，不然就算是开启科热跟新，只要修改任何文件。都会导致页面的重新加载。一开始我总是以为是hot热跟新没有配置好，不断的检查css,因为我默认是js改变就刷新页面的。所以只看css.发现改动html也会刷新页面。这个html刷新可是要单独用一个loader的，这里刷新显然是不对劲的。我一直以为是我用的css分离的插件除了问题，这个把我搞的昏头了。直到今天我重新又写了一个webpack的打包项目。专门来看css ,后来慢慢的试出来得加 hot ,最终也找到是我把生成的html又放在了一个目录router下导致的刷新。改动后就恢复正常了。不知道是webpack得要把html文件放在根目录下才会热跟新，还是如果放在一个目录里，会有别的配置。我还不清楚该怎样去网上收这个问题。其实就是路径多了一层导致出的问题。一般确实不需要这个多的一层。但是我想肯定会有一个这样的情况的，以后会遇到吗?现在我不想往这探究了。我还得继续完善这个webpack的配置。