Chrome安装vue应用调试工具: vue devtools

最新推荐文章于 2024-04-29 16:05:41 发布
最新推荐文章于 2024-04-29 16:05:41 发布
阅读量1.2k 收藏 1
点赞数
分类专栏： 前端开发
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_42483257/article/details/107132377
版权

chrome商店直接安装

  1. 打开chrome商店:https://chrome.google.com/webstore/ 
  2. 搜索栏输入： vue-devtools (一般都会选择第一个添加到chrome)
  3. 浏览器url输入：chrome://extensions/  进入拓展程序页面（选择刚刚安装的vue-devtools详细信息勾选启用允许访问文件网址 ）
  4. 将vue-devtools工具的mainfest.json配置文件中persistent修改成true

浏览器url输入：chrome:version 查看个人资料路径 （个人资料路径uri +\Extensions\nhdogjmejiglipccpnnnanhbledajbpd\+版本）

进入vue应用的网站(例如：https://cn.vuejs.org/)刷新 按F12看控制台窗口是否有vue选项

 

 

 

 

脑神
关注
  • 0
    点赞
  • 踩
  • 1
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 0
    评论
专栏目录
Vue3谷歌浏览器调试工具Vue.js devtools 6.1.4
05-30
Vue.js devtools 6.1.4,Vue3谷歌浏览器调试工具。开发vue3必备开发工具，跟踪数据便于调试，解决数据问题。
Chrome 浏览器安装Vue插件方法
zwj1030711290的CSDN
12-01 8262
在Chrome中 打开地址chrome://extensions/ 将D:\vue\vue-devtools-dev\shells\chrome文件夹拖入Chrome中。接下来通过cnpm安装vue插件依赖 ，淘宝镜像：输入cnpm install。一个使用技巧，定位到文件夹下面：直接输入 cmd 可以直接定位跳到当下目录。下载成功后接着输入npm run build 出现如下界面表示成功。验证npm是否安装成功命令，打开CMD输入。Chrome 浏览器安装Vue插件方法。不要去下载默认分支的。
Vue调试工具vue-devtools的安装与使用_vue调试工具安装
最新发布
2401_84447112的博客
04-29 910
主要介绍vue-devtools的安装与使用。
vue基本使用
小脆筒style的博客
10-31 560
vue基本使用 vue简介 vue特性 MVVM vue 的基本使用 一、vue简介 官方给出的概念：Vue (读音 /vjuː/，类似于 view) 是一套用于构建用户界面的前端框架 二、vue特性 数据驱动视图 双向数据绑定 1. 数据驱动视图： 在使用了 vue 的页面中，vue 会监听数据的变化，从而自动重新渲染页面的结构。示意图如下： 2. 双向数据绑定 在填写表单时，双向数据绑定可以辅助开发者在不操作 DOM 的前提下，自动把用户填写的内容同步到数据源 中。示意图如下：
在Chrome中安装vue_devtools调试工具
yyzx_yyzx的博客
07-05 1438
下载vue_devtools_chrome 链接：https://pan.baidu.com/s/13zrT7CS9h3jP6c9ddOATmA?pwd=dbj1 提取码：dbj1
Chrome DevTools浏览器开发者工具、Vue DevTools、vs和DevTools调试
luemeon的博客
06-30 3045
目录ElementsStylesDOM结构 增删属性 模拟元素的伪状态，方便调试Computed LayoutEvent ListenersNetworkApplication资源列表+（可改）本地存储Cookie、WebStorage（localStorage、sessionStorage）Source 调试Page:资源目录Content scripts: 插件Snippets: 便捷测试https://developer.chrome.com/docs/devtools Ancestors 是否
vue-devtools-简介、下载、安装、配置、使用
记录和分享属于我的“IT”时光
03-21 2万+
vue-devtools-简介、下载、安装、配置、使用
Vue项目调试工具：vue-devtools安装包
02-03
1. 安装Vue-devtools： - 直接方式：访问Chrome Web Store或Firefox Add-ons商店搜索"Vue.js devtools"，点击添加到浏览器。 - 手动方式：从给定的压缩包文件`vue-devtools-master`中，解压并按照官方文档指引，...
Chrome 安装Vue插件vue-devtools
06-24
开箱即用 加压包，找到shells下的chrome，再打开谷歌浏览器的扩展程序选中chrome
Vue项目调试工具：vue-devtools安装包（免费）
05-15
安装Vue Devtools后，在你打开一个Vue.js应用时，可以在Chrome的开发者工具中看到一个新的面板，这就是Vue Devtools。这个面板分为几个部分： 1. **Components**：显示当前页面中所有Vue组件的层次结构。你可以点击...
vue调试工具vue-devtools安装及使用方法
12-12
2. **重启浏览器**：安装或更新 Vue Devtools 后，需要关闭并重新打开浏览器才能生效。 3. **开发者模式**：确保在 Chrome 的扩展程序页面开启了开发者模式。 Vue Devtools 是 Vue.js 开发不可或缺的辅助工具，它...
VueDevtools-chrome插件-vue调试工具
04-08
在 Chrome 浏览器中安装 VueDevtools 扩展非常简单，只需访问 Chrome 网络应用商店，搜索 "Vue Devtools" 并安装即可。 Vue.js 和 Chrome 结合 VueDevtools 的使用，为前端开发者提供了强大的工具，大大提升了开发...
chrome安装Vue Devtools开发者工具
sinat_37024730的博客
02-06 3686
chrome安装Vue Devtools开发者工具
前端vue调试工具：chrome浏览器vue-devtools安装方式详述
qq_30907075的博客
01-09 1411
前端vue调试工具：vue-devtools谷歌浏览器安装方式详述；devtools安装手把手教程；vue调试工具devtools安装
小白教程： 谷歌安装 vue-devtools 拓展，无需编译
weixin_55746254的博客
08-03 2969
最简单安装 Vue-Devtools谷歌插件，小白教程
Chrome（谷歌浏览器）安装Vue插件vue-devtools（图文详细教程）
热门推荐
小钻风的博客
03-12 4万+
使用Vue开发项目时，常会用到一款谷歌浏览器插件，vue-devtools 安装成功后，运行本地Vue项目，打开浏览器控制台就如下： 其中可以便捷的查看vueX的数据以及组件结构等，非常方便， 安装步骤如下： 1、首先给大家提供一个git地址，虽然官网也有地址(https://github.com/vuejs/vue-devtools.git)，我认为不太好用 给大家提供另一个git地址： https://gitee.com/zhang_banglong/vue-devtools.git 打开里面就如
chrome安装Vue Devtools插件以及无法添加来自此网站的应用问题
baorant24的博客
11-07 1525
本文主要介绍Chrome浏览器中如何安装Devtools插件
vue3中使用devtools（chrome）（推荐第三种方法）
qq_29184685的博客
04-11 5334
1、下载最新版本：https://github.com/vuejs/devtools/tree/v6.1.4 （下载最新，有的老版本我感觉有些些问题） 2、解压到文件夹中 3、命令行进入文件夹中（或者用VScode等的终端操作），并且执行命令yarn install安装依赖 4、执行：yarn run build，到下图表示完成 5、chrome浏览器中打开chrome://extensions/，并且拖入packages文件下的shell-chrome文件夹 6、重新打开浏览器 ...
Chrome 安装 Vue 插件 vue-devtools
qq_44103359的博客
04-13 1090
Vue.js 是一个流行的 JavaScript 框架，用于构建用户界面和单页应用程序。Vue 的设计目的是能够灵活地适应开发者的需求，并且易于上手。Vue-devtools 是一个强大的浏览器扩展，它为 Vue 应用程序的开发和调试提供了便利。本文将详细介绍如何在 Chrome 浏览器中安装和使用 Vue 插件 vue-devtools。
Vue调试工具vue-devtools的安装
08-05
要安装Vue调试工具vue-devtools，可以按照以下步骤进行操作： 1. 首先，你需要在Chrome浏览器中安装Vue Devtools插件。你可以在Chrome网上应用商店中搜索"Vue Devtools"，然后点击"添加至Chrome"按钮进行安装。 2....

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

脑神

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付：¥1
获取中
扫码支付

您的余额不足，请更换扫码支付或充值

打赏作者

实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值