这两天在家没事，掏出了我的笔记本，准备找点东西看看。然后就安装了一系列的开发环境nvm----npm----vue-cli以及create-react-app。
在vue项目的运行过程中，当我修改js代码的时候，浏览器刷新但是代码并没有更新，但是官方的文档给出的解释是：vue-cli-service serve 命令会启动一个开发服务器 (基于 webpack-dev-server) 并附带开箱即用的模块热重载 (Hot-Module-Replacement)。
首先我觉得是浏览器的缓存问题。当我修改vue文件时，局部刷新，但是修改.js后，看起来局部刷新了但是视图并没有更新。当我尝试着手动刷新浏览器时，依旧不生效。然后我把缓存禁掉之后发现依旧不能更新视图。
关于局部刷新和浏览器刷新，webpack中的hmr功能，可以实现模块（vue、样式文件）的热更新以实现局部刷新从而提高构建速度。但是html、js通过浏览器刷新主要是因为webpack的打包构建原理就是以js为入口，打包对应的依赖。
然后就换成了safari的无痕模式，第一次数据是最新的。当我先修改vue文件时视图更新，但是之后只要修改.js文件视图就错乱了，即使刷新浏览器视图也是错乱的。但是新页面打开一个就是正确的视图。这时候我就猜测是hmr功能出了问题。通过查阅github中的issue以及其他的论坛。尝试着修改了webapack版本和package.json以及vue.config.js的配置，依旧无法生效，这时候已经晚上十一点多，我决定先睡觉，哈哈。
躺在床上我在思考一个问题，为什么在无痕模式下新页面打开的时候视图是正确的，默认浏览器下一直是不对的。我想我应该换成我经常用的chrome了。然后我睡了。
今天我下载了chrome，重新运行，成功了，无论是修改js还是vue都可以更新视图了。开心。 个人猜想可能是safari不兼容vue开发环境中部分脚本。欢迎大家有问题的可以一起探讨。 最后通过配置电脑中的host形式为ip+域名的格式 ，以及vue.config.js的如下配置实现域名加端口号访问服务。
devServer: {
host:'0.0.0.0',
port: 8080,
disableHostCheck: true, //跳过host检查，可以通过电脑中配置的域名进行访问。
}
