Vue--调试--Vue.js devtools

骑猪看日落 2023-01-23 11:50 44阅读 0赞

原文网址：[Vue--调试--Vue.js devtools\_IT利刃出鞘的博客-CSDN博客][Vue--_--Vue.js devtools_IT_-CSDN]

# **其他网址** #

> [相关工具 - vue-devtools - 《Vuejs 中文教程》 - 书栈网 · BookStack][- vue-devtools - _Vuejs _ - _ _ BookStack]
> 
> [Vue.js - 调试工具 vue-devtools 的安装与使用][Vue.js - _ vue-devtools]

# 简介 #

注意：前端代码要用开发版的vue.js，不要用mini版的(vue.min.js)，否则，会失去错误提示和警告。

# **下载**  #

**法1：直接在谷歌商店安装插件**

> [https://chrome.google.com/webstore/detail/vuejs-devtools/nhdogjmejiglipccpnnnanhbledajbpd][https_chrome.google.com_webstore_detail_vuejs-devtools_nhdogjmejiglipccpnnnanhbledajbpd]

**法2：去github下载插件然后安装（实际也是跳转到了谷歌商店）**

> [https://github.com/vuejs/vue-devtools\#vue-devtools][https_github.com_vuejs_vue-devtools_vue-devtools]

**设置**

> “设置 “ => ‘更多工具’ => ‘扩展程序’=> 勾选下面的 “允许访问文件网址”（如下图所示）
> 
> ![1eb31d5e3a5b8d2850ff48a4f096481f.png][]

## 使用 ##

**其他网址**

> [web前端开发:教你使用Vue.js的DevTools来调试你的vue项目 - 知乎][web_Vue.js_DevTools_vue_ -]

[Vue--_--Vue.js devtools_IT_-CSDN]: https://knife.blog.csdn.net/article/details/118733656
[- vue-devtools - _Vuejs _ - _ _ BookStack]: https://www.bookstack.cn/read/happy_book_vuejs/setup_vuejs_devtools.md
[Vue.js - _ vue-devtools]: https://www.hangge.com/blog/cache/detail_2110.html
[https_chrome.google.com_webstore_detail_vuejs-devtools_nhdogjmejiglipccpnnnanhbledajbpd]: https://chrome.google.com/webstore/detail/vuejs-devtools/nhdogjmejiglipccpnnnanhbledajbpd
[https_github.com_vuejs_vue-devtools_vue-devtools]: https://github.com/vuejs/vue-devtools#vue-devtools
[1eb31d5e3a5b8d2850ff48a4f096481f.png]: /images/20221004/14a6778e62ff488fab3f60d73112e5f6.png
[web_Vue.js_DevTools_vue_ -]: https://zhuanlan.zhihu.com/p/33771617