Fatal编程技术网
  • vuejs2/
  • Vuejs2 VueJs开发工具面板未显示

Vuejs2 VueJs开发工具面板未显示

vuejs2 vue.js

Vuejs2 VueJs开发工具面板未显示,vuejs2,vue.js,vue-resource,Vuejs2,Vue.js,Vue Resource,我开始在我的应用程序中使用它，但在Chrome的开发者模式下它是不可见的。我尝试了在开发工具github页面和web上其他地方找到的各种解决方案，但没有成功。下面是我所做的/试图让它显示出来的事情 启用允许访问chrome扩展名中的文件URL选项 添加了Vue.config.debug=trueVue.config.devtools=true就在新Vue（{}）之前 添加了VueJS文件的非精简版本 我也在使用Chrome的最新版本：55.0.2883.87 当我点击chrome扩展时，我确实收

我开始在我的应用程序中使用它，但在Chrome的开发者模式下它是不可见的。我尝试了在开发工具github页面和web上其他地方找到的各种解决方案，但没有成功。下面是我所做的/试图让它显示出来的事情

  • 启用
    允许访问chrome扩展名中的文件URL选项
  • 添加了
    Vue.config.debug=true
    Vue.config.devtools=true就在新Vue（{}）之前
  • 添加了VueJS文件的非精简版本
  • 我也在使用Chrome的最新版本：55.0.2883.87
    • 当我点击chrome扩展时，我确实收到了以下消息

    除了面板没有实际显示

    有人能解决这个问题吗？谢谢。

    今天还发现，如果您安装了广告拦截器，这也会阻止Vue Devtools正常运行。

    只需执行几次“硬重新加载”。在windows上：SHIFT+F5。
    在Mac上：CMD+SHIFT+R.

    关闭文件选项卡并重新打开它对我很有效

    我无法在菜单栏上激活Vue图标，但是我可以在Chrome开发者工具中显示Vue选项卡。请尝试以下操作：

    • 关闭Chrome开发者工具窗口
    • 硬刷新浏览器
    • 重新打开“开发人员工具”窗口并查找Vue选项卡
    工具栏中的图标可能仍然表示无法检测Vue，但该选项卡应在Chrome developer工具中可见

    只需执行硬重新加载并关闭开发控制台，然后重新打开它。

    我遇到了同样的问题，我使用的是cdn“vue.min.js”中的小型vue。然后我删除了它并使用了非小型vue。然后我重新加载浏览器并重新打开控制台，vue选项卡就在那里。

    请确保您不使用生产CDN。让它对我起作用的唯一方法是使用VueJS开发版本

    开发：

    对我来说，我正在运行一个本地HTML文件。默认情况下，Chrome阻止扩展在本地文件上工作

    • 3点菜单->更多工具->扩展

    • 找到Vue扩展名，单击详细信息并更改打开设置“允许访问文件URL:

    • 多次重启谷歌浏览器

    • 不要使用min文件

    • 并在新vue实例化之前添加：

      Vue.config.devtools = true;
    这种情况周期性地发生在我身上，非常恼人，因为似乎没有任何原因

    • 转到Chrome浏览器扩展
    • 卸下Vue DevTools扩展插件
    • 重新添加它
    • 硬刷新页面
    Chrome-版本71.0.3578.98

    马科斯莫哈韦10.14

    VueJS 2.5.21

  • 关闭chrome应用程序
  • 重新运行开发服务器
  • 重新打开chrome应用程序
  • 打开本地主机
  • 按F12键（打开开发工具）
    • 步骤1:添加
    vue.js devtools
    作为

    步骤2:添加
    vue.js devtools
    后，关闭浏览器

    第3步：打开浏览器并打开html页面

    步骤4:单击鼠标右侧，选择
    inspect
    并尝试查找
    Vue

    注意：如果没有添加vue.js的CDN，请将这些行添加到html文件中

    <script src="https://cdn.jsdelivr.net/npm/vue@2"></script>
    您应该启用允许从Vue扩展访问文件URL，然后使用Shift+F5硬刷新页面 这对我很有效

    很难重新加载，帮帮我

    打开开发工具->右键单击重新加载按钮->硬重新加载可能很明显，但在匿名模式下Vue面板不可用。在这种情况下，Vue图标也不可见。

    （对于Firefox浏览器）如果在浏览器中添加了加载项“Vue.js开发工具”。只需单击Inspect元素（或按F12）Vue有一个选项卡以及检查器、控制台、网络等。单击该Vue选项卡并享受调试。

    使用Vue 3的devtools测试版。并始终检查Vue应用程序是否正确安装。

    请提供您的devtools的详细信息。我为Vue-devtools-3.0做出了贡献，因此我密切关注，以确保我没有破坏任何东西ng.这很可能是问题所在：不幸的是，我仍然有同样的问题。我尝试了不同的方法来获得chrome扩展。通过克隆repo构建开发工具应用程序。但仍然没有成功。我没有看到vue开发工具面板。你有没有可能将我下面的答案标记为正确答案？我没有投票反对，我认为是因为我没有投票反对v这是因为它看起来像是几个月前我的答案的副本…哦，谢谢你。这是唯一对我有效的解决方案。挽救了我的一天。我刚刚关闭并重新打开Chrome，这就足够了。谢谢你的提示。在我的情况下，Vue DevTools图标点亮并检测到Vue.js，但Chrome的开发中没有Vue选项卡工具面板。关闭DevTools、硬刷新页面和重新打开DevTools使我能够看到Vue面板，但Vue功能不存在（例如，未检测到任何组件）。我必须完全关闭Chrome并重新启动它，然后一切正常。奇怪。硬重新加载（mac上的shift+cmd+r）和重新加载（关闭和打开）chrome inspect解决了这个问题。（2020年是的）不起作用。只有测试版对我有效。