关于dev-tool安装方法(手动安装版)

更新时间：2024年07月01日 11:16:57 作者：YOGiii

这篇文章主要介绍了关于dev-tool安装方法(手动安装版),具有很好的参考价值,希望对大家有所帮助,如有错误或未考虑完全的地方,望不吝赐教

一、dev-tool源码获取

git地址：https://github.com/vuejs/devtools/tree/main

这里可以选择自己需要的版本，试了挺多版本，在安装的时候会遇到各种的文件缺失的问题，所以这里选择了一个v5.1.1版本，这个安装的过程基本比较顺畅，没什么大的问题。

版本切换

源码下载两种方式，

第一种直接用git下载，git访问会出现连接失败的报错，有SSL验证和代理的问题，具体的问题遇到了可以自行搜索解决方法；

这里为了方便直接点击Download ZIP下载压缩包就好。

源码获取

二、源码编译

这一步主要是安装依赖和编译源码，手动安装的过程官网教程也说得非常清楚，如果下载的版本一样的话直接执行以下指令就行

npm install//安装依赖,如果使用yarn进行包管理则yarn install
npm run build

完成后可以在文件夹里找到这个文件

chrome扩展文件

三、添加扩展程序

打开chrome浏览器，自定义及控制-更多工具-扩展程序，切换成开发者模式，点击加载已解压的扩展程序，选择第二步中的shells/chrome文件即可，

加载扩展程序

扩展程序的配置如下：

扩展程序配置

四、愉快地使用dev-tool

到此为止就可以使用dev-tool进行调试了，随便开一个vue项目，打开f12,切换到vue就ok了

dev-tool使用

总结

以上为个人经验，希望能给大家一个参考，也希望大家多多支持脚本之家。

您可能感兴趣的文章:

iview+vue实现导入EXCEL预览功能
这篇文章主要为大家详细介绍了iview+vue实现导入EXCEL预览功能，文中示例代码介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们可以参考一下
2022-07-07
element-ui 弹窗组件封装的步骤
这篇文章主要介绍了element-ui 弹窗组件封装的步骤，帮助大家更好的理解和使用vue框架，感兴趣的朋友可以了解下
2021-01-01
vite.config.js配置入门详解
本文主要介绍了vite.config.js配置入门详解，文中通过示例代码介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们可以参考一下
2022-01-01
Vue3利用自定义指令进行内容控制的实现方法
Vue3作为一个渐进式JavaScript框架,提供了强大的自定义指令功能,使得权限控制变得既简单又高效,本文将详细介绍如何在Vue3中使用自定义指令来判断内容是否显示,以满足不同用户权限下的界面展示需求,需要的朋友可以参考下
2024-04-04
Vue3使用v-if指令进行条件渲染的实例代码
条件渲染是根据条件的真假来有条件地渲染元素,在Vue.js 3.x中,常见的条件渲染包括使用v-if指令和v-show指令,本文讲解使用v-if指令进行条件渲染,需要的朋友可以参考下
2024-03-03
Vue.js实战之Vuex的入门教程
这篇文章主要给大家介绍了Vue.js实战之Vuex的入门教程，文中介绍的非常详细，相信对大家具有一定的参考价值，需要的朋友们下面来一起看看吧。
2017-04-04
Vue3插槽(slot)使用方法详解
在VUE开发项目的过程中,插槽<slot>是重要的承载分发内容的出口,下面这篇文章主要给大家介绍了关于Vue3插槽(slot)使用的相关资料,文中通过实例代码介绍的非常详细,需要的朋友可以参考下
2022-11-11
Vue利用openlayers实现点击弹窗的方法详解
点击弹窗其实就是添加一个弹窗图层，然后在点击的时候让他显示出来罢了。本文将利用openlayers实现这一效果，快跟随小编一起学习一下吧
2022-06-06
前端不用跑项目vscode组件效果所见即所得
这篇文章主要为大家介绍了一款不用跑项目的vscode组件所见即所得效果的使用方法，有需要的朋友可以借鉴参考下，希望能够有所帮助，祝大家多多进步，早日升职加薪
2022-04-04
基于vue+face-api.js实现前端人脸识别功能
基于face-api.js要实现人脸识别功能,首先要将自己需要的模型文件下载保存在静态目录下,可以通过cdn的方式在index.html中引入face-api.js,本文给大家介绍vue+face-api.js实现前端人脸识别功能,感兴趣的朋友一起看看吧
2023-12-12