前几天搭建了一个基于vue/cli3的新项目，配置完vue.config.js之后，一切顺利，似乎没什么问题。但是打开控制台一看，console里的信息来源都变成了VMXXXX，鼠标移上去还会显示debugger:///VMXXXXXX，如下图：

仔细研究一下发现，不止是显示出现问题，同时console里面的信息也打印了两次。
进一步观察发现，不止是信息打印，而是app.vue的生命周期随着子组件的显示和隐藏，被重复执行了。
刚发现这点时真的震惊了，一度以为是自己代码写得有问题或者是vue.config.js的配置有严重问题。

随后各种百度，论坛，聊天群求助无果。
最后的解决方案莫名其妙，升级一下chrome就好了 。
之前的版本是7xxx，重新安装了最新的84版本，就没有这个另人困扰的问题了。

---

---

我真的服了。。。又特么出来了。
求解决方案啊。。。！！！

---

---

稳住，别慌，问题不大。
经过一些列排查（删了建，建了删），问题一步步的明朗起来。

先说结论：
1、和浏览器无关，因为上面已经证实了。
2、和vue.config.js的配置无关，因为我已经在cli2环境下复现该问题。
3、代码的锅。

问题出在下图中的函数中。

该函数动态的创建了一个iframe，并且添加到了文档中，然后再删除。
问题出在创建的时候，会通过iframe标签的src属性发送一个document的请求，同时添加iframe标签。
而在vue项目中，此番操作会导致整个项目无闪烁刷新，所有资源（除了index.html之外）都重新加载。
至于为什么，我查阅了很久找不到答案，求路过大神告知。

这也就是为什么，上面提到的console会打印两次，生命周期也走了两次，都是因为调用了该方法。

那么为什么要加这个函数？
分析代码，很容易看到是为了改变文档标题而写，那么改变标题用document.title就够了，为什么还要加下面的一大团？
又是一番查阅，终于发现端倪，是为了解决一个兼容性问题而添加的：

iso微信浏览器环境中，无法通过document.title改变文档标题，详见知乎讨论。

当然了，看到后来又有很多回答说此bug已经修复，所以无需使用该hack功能。
但是由于目前公司网络封网维护，无法部署线上环境测试，所以也不清楚是否真的不用再加这个iframe了。

既然找到了问题，那么解决问题就很简单，注释下方的iframe即可防止页面伪刷新，或者将iframe的src地址置空。

任何祖传代码都有他产生的特定背景，例如上述例子中，能够想象到当时的开发人员为了解决ios微信下改变不了文档标题的无奈，所以百度到了这样一团代码，虽然不明原理，但是能够解决问题。

---

---

刚本地局域网用ios真机测试了一下，去掉iframe相关代码，仅靠document.title，能够成功修改文档标题。
说明微信中这个问题已经修复了，所以可以放心的去除iframe代码了。