为什么 Vue.js Chrome Devtools 没有检测到 Vue.js?

新手上路,请多包涵

我有以下代码和一个简单的 Vue.js 应用程序。但是 vue.js 开发工具没有响应。前几天还好好的,现在就不行了,怎么回事?当我去 https://chrome.google.com/webstore/detail/vuejs-devtools/nhdogjmejiglipccpnnnanhbledajbpd 时,它说它已经添加了。

 <!doctype html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport"
        content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
  <meta http-equiv="X-UA-Compatible" content="ie=edge">

  <script src="https://unpkg.com/vue@2.1.6/dist/vue.js"></script>

  <title>Document</title>
</head>
<body>
<div class="container">
  <div id="application">
    <input type="text" v-model="message">
    <p>The value of the input is: {{ message }}</p>
  </div>
</div>

<script>
  let data = {
    message: 'Hello World'
  }

  new Vue({
    el: '#application',
    data: data
  })
</script>
</body>
</html>

原文由 Simon Suh 发布,翻译遵循 CC BY-SA 4.0 许可协议

阅读 643
2 个回答

如 OP 所述,一种替代方法是设置本地 Web 服务器。

另一个 - 恕我直言,它更快且骚扰更少 - 让扩展程序可以访问文件 URL,默认情况下禁用。

只需转到 chrome://extensions 并为 Vue.js 开发工具选中“ 允许访问文件 URL ”框。

资料来源:

https://github.com/vuejs/vue-devtools#common-problems-and-how-to-fix

原文由 Cesar Castro 发布,翻译遵循 CC BY-SA 4.0 许可协议

我尝试了此处答案中提供的所有方法,但没有一个对我有用(既不适用于 chrome 也不适用于 firefox)。

终于找到了答案:如果还是有这个问题,可以尝试卸载当前版本的Vue扩展,安装 beta版https ://v3-migration.vuejs.org/break-changes/introduction.html#devtools -扩大

记得之后重新启动浏览器。

原文由 Przemysław Niemiec 发布,翻译遵循 CC BY-SA 4.0 许可协议

撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题