未显示Vue.js devtools

Question

突然，我的Vue.js开发工具停止了工作。我把它放在chrome中差不多两年了(自从我开始开发Vue.js)。现在我在chrome中看不到devtools了。昨天的事情就是这样发生的--我使用devtools有一段时间了，然后我在做别的事情，过了一段时间，我注意到了一些东西-- devtools已经不在了。尽管扩展说devtools可以工作：

​

为什么不是“我的”问题：

我已经用了两年了，一直到现在都没有问题。

它在早上工作，然后“就”停止了

现在它不能工作了

任何

项目，就连我都知道它以前是有效的

我没有使用生产模式，缩小版本，等等。我以前是通过webpack编译的，并且工作过。

即使在simple-fresh Vue.js应用程序上也不起作用

*

为什么我尝试了这么久：

硬刷新网站(当然是关闭并重新打开devtools )

重新启动浏览器

重新安装扩展

已尝试

此版本

还有

此错误修复版本

注销并从帐户登录

已启用分机的所有设置：

​

操作系统

：macOS Catalina 10.15.4 (19E287)

浏览器

：83.0.4103.61

Vue.js DevTools

：5.3.3

*

新的Vue.js应用程序代码如下所示：

Document


    
        {{ message }}
    

    
    
        var app = new Vue({
            el: '#app',
            data: {
                message: 'Hello Vue!'
            }
        });

它仍然不能工作(是的，扩展仍然显示“在此页面上检测到Vue.js。打开DevTools并...”)：

​

Answer 1

我在Chrome和Firefox上也经历过这种情况。

不幸的是，Chrome的解决方案是将其更新到最新版本(今天是Windows上的83.0.4103.106，64位)。

对于火狐(77.0.1，64位)，我禁用了所有其他扩展，在没有打开Firefox Devtools的情况下加载页面，然后点击F12，弹出了Vue选项卡。

一般来说，禁用任何其他扩展(例如"Ad Block Plus“或”我不关心cookies“)可能会有所帮助。

编辑

添加了我遇到的另一个案例，当Vue选项卡在Chrome的Devtools中没有显示时：

在未打开Devtools的情况下加载页面

按下扩展区中的Vue Devtools按钮(可能会说“未检测到Vue.js”，但请不要担心)。在某些设置中，这一步至关重要。

仅限

然后

点击F12打开Devtools。Vue选项卡应出现(选中所有选项卡最右侧，您可以将其拖动到左侧)

Answer 2

Vuejs devtools可能没有显示的另一个原因是因为您运行了

或者

因此，在这种情况下，扩展将检测Vuejs，但不会在devtools中显示。

所以你要么跑

或者

..。

关闭devtools，重新加载页面并打开devtools

Answer 3

我发现我必须执行Ctrl+C来退出当前进程，然后再次运行"php artisan serve“，然后Vue tool就会出现在Chrome中