AI 助理
文档备案控制台
开发者社区 开发与运维 文章 正文

谷歌浏览器chrome安装vue调试插件Vue-Devtools

2024-07-02 4259
版权
版权声明：
本文内容由阿里云实名注册用户自发贡献，版权归原作者所有，阿里云开发者社区不拥有其著作权，亦不承担相应法律责任。具体规则请查看《 阿里云开发者社区用户服务协议》和 《阿里云开发者社区知识产权保护指引》。如果您发现本社区中有涉嫌抄袭的内容，填写 侵权投诉表单进行举报，一经查实，本社区将立刻删除涉嫌侵权内容。
简介： 谷歌浏览器chrome安装vue调试插件Vue-Devtools

1. 下载并解压Vue-Devtools

https://codeload.github.com/arcliang/Vue-Devtools-/zip/refs/heads/master

解压后得到

2. 打开谷歌浏览器的应用商店

谷歌浏览器访问 chrome://extensions/  开启开发者模式

3. 安装Vue-Devtools

得到

4. 验证Vue-Devtools是否启动成功

关闭谷歌浏览器，重新打开谷歌浏览器，访问vue项目页面，Ctrl + Shift + i 打开浏览器的控制台，可以看到vue调试页签

文章标签：
JavaScript
Web App开发
开发者
关键词：
谷歌浏览器
浏览器vue插件
Chrome安装vue
谷歌浏览器chrome
谷歌Chrome插件
朝阳39
目录
相关文章
nine很菜
|
11月前
|
Web App开发 人工智能 IDE
从痛点到解决方案：为什么我开发了Chrome元素截图插件
传统的截图方式要么截取整个页面然后手动裁剪，要么使用浏览器自带的截图功能，但效果都不理想。特别是当内容包含SVG元素或复杂样式时，截图质量和速度、便捷性往往不尽如人意。
nine很菜
401 4
nine很菜
|
11月前
|
Web App开发 人工智能 前端开发
产品发布策略：如何让Chrome插件在竞争激烈的市场中脱颖而出
Chrome Web Store每天新增很多个插件。插件刚发布，用户只有我自己，如何在这样的红海市场中找到自己的位置，是我一直在思考的问题。
nine很菜
391 0
Nico
|
Web App开发 存储 开发者
Chrome 插件上架发布全流程指南
浏览器插件开发完以后，要发布到 Chrome Web Store上，也是需要颇费一番周折的，本文就从注册账号开始，一直到最后发布上架的全流程进行指导，希望帮助你提供一些经验，避免踩坑，耗时耗力。
Nico
1901 8
奔跑的数据
|
Web App开发 数据采集 存储
WebDriver与Chrome DevTools Protocol：如何在浏览器自动化中提升效率
本文探讨了如何利用Chrome DevTools Protocol (CDP) 与 Selenium WebDriver 提升浏览器自动化效率，结合代理IP技术高效采集微博数据。通过CDP，开发者可直接操作浏览器底层功能，如网络拦截、性能分析等，增强控制精度。示例代码展示了如何设置代理IP、cookie及user-agent来模拟真实用户行为，提高数据抓取成功率与稳定性。适用于需要频繁抓取互联网数据的应用场景。
奔跑的数据
1880 3
WebDriver与Chrome DevTools Protocol：如何在浏览器自动化中提升效率
我是快乐的嘟嘟
|
Web App开发 JSON 安全
Chrome浏览器的跨域问题
【10月更文挑战第6天】
我是快乐的嘟嘟
3042 123
我是快乐的嘟嘟
|
Web App开发 存储 前端开发
Chrome浏览器的跨域问题
Chrome浏览器的跨域问题
我是快乐的嘟嘟
1351 128
蚝油菜花
|
Web App开发 人工智能 JSON
AutoMouser：AI Chrome扩展程序，实时跟踪用户的浏览器操作，自动生成自动化操作脚本
AutoMouser是一款Chrome扩展程序，能够实时跟踪用户交互行为，并基于OpenAI的GPT模型自动生成Selenium测试代码，简化自动化测试流程。
蚝油菜花
1377 17
AutoMouser：AI Chrome扩展程序，实时跟踪用户的浏览器操作，自动生成自动化操作脚本
小白学大数据
|
Web App开发 数据采集 JavaScript
Chrome浏览器实例的TypeScript自动化脚本
Chrome浏览器实例的TypeScript自动化脚本
小白学大数据
763 1
mao29955
|
Web App开发 JavaScript 前端开发
使用 Chrome 浏览器的内存分析工具来检测 JavaScript 中的内存泄漏
【10月更文挑战第25天】利用 Chrome 浏览器的内存分析工具，可以较为准确地检测 JavaScript 中的内存泄漏问题，并帮助我们找出潜在的泄漏点，以便采取相应的解决措施。
mao29955
1963 9

热门文章

最新文章

  • 1
    80%的Android手机用户面临浏览器安全风险
  • 2
    谷歌57版本设置浏览器编码
  • 3
    QtWebkit中浏览器插件的设计-1
  • 4
    浏览器多个tab页面之间通过localStorage进行通信
  • 5
    VS2010ReportViewer教程(6)-将报表浏览器与报表联系
  • 6
    【爬虫知识】浏览器开发者工具使用技巧总结
  • 7
    Docker基础 docker创建centos7容器然后安装配置Nginx，并在浏览器访问
  • 8
    Opera将尽快发布补丁修复桌面浏览器漏洞
  • 9
    JS-检测浏览器类型及版本
  • 10
    采用QWebEngineView引擎设计web浏览器
  • 1
    Chrome 下载大文件报错！用 Streamsaver.js 完美填坑
    5051
  • 2
    产品发布策略：如何让Chrome插件在竞争激烈的市场中脱颖而出
    391
  • 3
    开发实战：从0到1实现Chrome元素截图插件的完整过程
    784
  • 4
    从痛点到解决方案：为什么我开发了Chrome元素截图插件
    401
  • 5
    快速搞定Dify+Chrome MCP：打造能操作网页的AI助手
    1877
  • 6
    Win10 Chrome认不出新Emoji？两个扩展搞定显示与输入
    1513
  • 7
    快速掌握Dify+Chrome MCP：打造网页操控AI助手
    1558
  • 8
    快速搞定Dify+Chrome MCP：打造能操作网页的AI助手
    1818
  • 9
    基于PyCharm与Mac系统的Chrome历史记录清理工具开发实战
    569
  • 10
    Python + Chrome 爬虫：如何抓取 AJAX 动态加载数据？
    760

    • 相关电子书

    更多
  • 低代码开发师（初级）实战教程
  • 冬季实战营第三期：MySQL数据库进阶实战
  • 阿里巴巴DevOps 最佳实践手册
    • 下一篇
    一条命令迁移，帮你实现 OpenClaw 与 Hermes Agent 记忆互通！