Vue devtool的多种安装方式

最新推荐文章于 2025-05-01 15:52:19 发布
最新推荐文章于 2025-05-01 15:52:19 发布
阅读量1k 收藏 1
点赞数 1
分类专栏： Vue2&Vue3 文章标签： vuex chrome devtools vue devtoos devtools
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.youkuaiyun.com/weixin_47529373/article/details/118600337
版权
本文介绍了Vue devtools的两种安装方法，重点讲述了通过GitHub下载源码并使用yarn进行局部安装的步骤，包括克隆仓库、安装yarn、管理依赖及打包完成安装。

摘要生成于 C知道 ，由 DeepSeek-R1 满血版支持， 前往体验 >

Vue devtools的安装

两种方式，主要将第二种，略微记录第一种。

第一种：通过Chrome网上应用店 进行Vue devtools的安装

第二种：通过Github上 Vue devtools的代码进行安装

  • Vue devtools 仓库地址

    先将其克隆到本地
    image-20210707223956215

  • 查看目录解构可知：使用 yarn进行包管理的。有 yarn的直接跳过下一步，没有的可以看下一步。

  • 安装yarn。全局安装npm install yarn -g 局部安装： npm install yarn -D演示使用局部安装的。

  • 安装依赖 npx yarn or npx yarn install，全局的yarn安装依赖去掉 npx

了解本专栏 订阅专栏 解锁全文 超级会员免费看
下载、编译、安装、使用 vue-devtools
weixin_59916662的博客
10-17 3万+
下载、编译、安装、使用vue-devtools
Vue.js 调试神器：Vue Devtools 安装与使用全攻略
bairuoqing的专栏
02-20 2870
Vue Devtools 是一款专为 Vue.js 应用程序设计的调试工具，支持 Chrome 和 Firefox 等主流浏览器。它可以帮助开发者查看组件树结构、监控组件状态、分析性能瓶颈，并支持时间旅行调试。Vue Devtools 支持自定义插件，可以通过扩展其功能来满足特定需求。Vue Devtools 是一款功能强大的调试工具，能够帮助开发者快速定位和解决问题，提升开发效率。通过本文的介绍，你已经掌握了 Vue Devtools 的安装和使用方法。
vue开发者工具dev-tool的安装
weixin_50680057的博客
04-13 1269
1、下载网址：https://github.com/Redxym/dev-tools 2、谷歌浏览器-》扩展程序，拖动刚刚下载好的压缩包，将chrome文件夹添加至‘加载已解压的扩展程序’
Vue调试工具vue-devtools的安装与使用_vue调试工具安装
2401_84447112的博客
04-29 1742
主要介绍vue-devtools的安装与使用。
Vue.js开发者工具：Vue Devtools实战指南
最新发布
weixin_35592186的博客
05-01 948
Vue.js，一个轻量级、渐进式JavaScript框架，由前谷歌工程师尤雨溪于2014年推出，旨在简化Web界面的开发。起源于早期的AngularJS项目，Vue.js迅速发展，成为前端开发者最受欢迎的框架之一。它的轻量级特性和易学易用的API使得它在短时间内吸引了大量开发者。Vue Devtools 是一个扩展程序，能够为 Vue.js 应用程序提供强大的调试能力。其基本功能包括但不限于：组件树的可视化检查、状态监控、事件监听以及时间旅行调试等。
安装vue-devtool
weixin_42349568的博客
12-04 627
新买了台电脑，想要安装vue-devtool，发现安装不上，特此记录下。 一，下载 因为某种大家都知道的原因，外网上不了。 可以使用这里的下载地址： https://chrome.zzzmh.cn/info?token=ljjemllljcmogpfapbkkighbhhppjdbg 选择meta版本。可以支持vue3。 二，安装 谷歌浏览器-更多工具-扩展程序界面打开后，把下载后解压的文件拖进去就行了。 如果出现“无法从该网站添加应用、扩展程序和用户脚本”的问题。 谷歌浏览器输入 chrome://fl
npm run build无法安装vue devtools，使用另一种方法成功安装
qq_44850230的博客
10-08 317
npm run build无法安装vue devtools，使用另一种方法成功安装 用github 的下载包安装，到npm run build 的时候问题会出现一些问题。下面就介绍一下解决的方法。 创建一个空文件夹，进入这个文件夹按住 shift + 右键 选择进入powershell ，就可以进入这个文件的终端。 输入： npm install vue-devtools 完成后，进入该文件下的node_modules 文件，找到 vue-devtools 文件，进入其中，将vender 文件拖至谷歌浏览
掌握vue-devTool：编译安装与源代码使用指南
Chrome插件可以通过多种方式安装，包括从Chrome网上应用店直接安装、通过开发者模式安装本地CRX文件等。安装过程包括解压缩插件文件，并将其添加到浏览器中。 8. 自定义编译和安装的意义 自定义编译和安装vue-...
vue.js devtools 5.3.4
10-22
安装方面，Vue.js Devtools 5.3.4 的安装过程简单便捷。开发者只需访问提供的安装地址，就可以轻松将插件添加到 Chrome 浏览器或新版的 Edge 浏览器中。无论是新手还是经验丰富的开发者，都可以快速完成安装，开始...
vue开发调试神器vue-devtools使用详解
08-30
Vue-DevTools提供了多种实用的功能和特点，旨在帮助开发者快速高效地调试和优化Vue.js项目。以下是Vue-DevTools的一些主要特点和功能： * 可以查看和调试Vue.js项目的DOM结构和数据结构 * 可以实时监控和调试Vue.js...
渗透测试——漏洞扫描工具
wuli1024的博客
11-20 2643
然后还要将all这个压缩包里的plugin_feed_info.inc提取出来，命令行是 tar -zxvf all-2.0.tar.gz plugin_feed_info.inc，然鹅，我提取不出来。将下载好的插件移动到Nessus目录下，然后输入sudo /opt/nessus/sbin/nessuscli update all-2.0.tar.gz。用户名和密码随便写写就好，随后将会更新补丁，OK，这样Nessus可以使用了。将会获得一串数字，然后去激活码的这个网站，输入自己的邮箱获取激活码。
打包vue-devtool 时 报错
Your_little_cyy的博客
12-17 1万+
安装vue-devtool 报错 npm run build打包时报错： lerna ERR! yarn run build exited 1 in '@vue/devtools-api' lerna ERR! yarn run build stdout: yarn run v1.22.17 $ rimraf lib && yarn build:esm && yarn build:cjs $ tsc --module es2015 --outDir lib/esm -d in
【Vue】全家桶之vue-devtools
在这里你大概率会有所收获，欢迎指错||纠正||建议||水评+点赞&&评论&&关注&&转发
08-08 1万+
Vue Devtools 是 Vue 官方发布的调试浏览器插件，可以安装在 Chrome 和 Firefox 等浏览器上，直接内嵌在开发者工具中，使用体验流畅。Vue Devtools 由 Vue.js 核心团队成员 Guillaume Chau 和 Evan You 开发。
Vue DevTools
Vinca@的博客
06-21 1万+
当你开发 Vue 应用时，Vue DevTools 是一个非常有用的工具，可以帮助你调试、监控和优化你的应用。本文将全面介绍 Vue DevTools 的功能和用法，并提供了一种通过 vue3 快捷安装命令一键安装 Vue DevTools 的方法。此外，还将介绍如何在 VS Code 中使用 Vue DevTools，帮助你更高效地开发 Vue 项目。
vue devtools安装及使用
qq_45107916的博客
10-30 290
vue-devtools使用 在vue学习开发之前，应安装vue-devtools为我们提供一个界面，用来查看vue组件和全局状态管理器vuex中记录的数据。如果你可以访问google web store，请在store中安装。 git clone https://github.com/vuejs/vue-devtools 这里需要注意：应该使用master而不是dev 2.cd到当前目录 npm install（或者使用淘宝镜像-cnpm） 3.npm run build npm ru
npm run build无法安装vue-devtools的另一种安装方法
Diandaoweizhi1的博客
09-26 301
一、正常安装步骤 git clone https://github.com/vuejs/vue-devtools cd vue-devtools cnpm install 修改manifest.json文件 把"persistent":false改成true npm run build 如果npm run build 报错： 二、另一种安装方式： 创建一个文件夹，进入当前文件夹的终端。 输入npm install vue-devtools 安装好后，找到该文件夹下的node_modules/vue-
vue cli3 搭建vue开发环境
csdn_fanhehua的博客
09-30 959
一、Window 搭建Vue开发环境 操作系统：Window Node：12.18.4 长期支持版 Vue.js： vue-cli: 3 版本 二、安装工具： 2.1 安装Node软件 2.1.1下载Node.js，网址：https://nodejs.org/zh-cn/ 2.1.2 安装Node.js，点击下载好的软件直接双击安装 2.1.3查看安装Node.js #查看是否安装成功 C:\Users\Administrator>node --ve...
vue-devtools-简介、下载、安装、配置、使用
热门推荐
记录和分享属于我的“IT”时光。
03-21 2万+
vue-devtools-简介、下载、安装、配置、使用
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

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

余额充值