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

2023-11-15

记录一下vue调试神器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使用

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

dev-tool安装方法(手动安装版) 的相关文章

随机推荐

  • gitlab修改密码后无法pull的解决方法

    在登录gitlab的时候发现密码忘记了 在重新设置了密码之后 git无法pull代码 需要改windows下的凭据管理器中对应gitlab地址的凭据密码 把密码修改成你的新密码 个人建的交流群1125844267 欢迎大家加入 如果内容对大
  • OpenGL文字渲染的实例(C/C++)

    OpenGL文字渲染的实例 C C 在计算机图形学中 文字渲染是一个常见的任务 它涉及将字符或文本字符串呈现在屏幕上 OpenGL是一个广泛使用的图形库 它提供了强大的功能来渲染2D和3D图形 并且也支持文字渲染 本文将介绍如何使用Open
  • springboot 没有找到service_Spring Boot 应用程序五种部署方式

    翻译自 Deploying Spring Boot Applications 1 原作者 Murat Artim 2 可以使用各种方法将 Spring Boot 应用程序部署到生产系统中 在本文中 我们将通过以下 5 种方法来部署 Spri
  • 卡尔曼滤波之线性滤波,标量滤波

    卡尔曼滤波器由一系列递归数学公式描述 它们提供了一种高效可 计算的方法来估计过程的状态 并使估计均方误差最小 卡尔曼滤波 器应用广泛且功能强大 它可以估计信号的过去和当前状态 甚至能 估计将来的状态 即使并不知道模型的确切性质 对于Kalm
  • JAVA 快速排序算法(详细实现过程介绍)

    快速排序采用了一种分治的策略 通常称其为分治法 Divide and ConquerMethod 空间复杂度 快速排序是一种原地排序 只需要一个很小的栈作为辅助空间 空间复杂度为O log2n 所以适合在数据集比较大的时候使用 时间复杂度
  • 右腿驱动电路

    转自 http www 360doc com content 18 0312 15 1751130 736374982 shtml 1 使用目的 人和外界环境 尤其是电力线会形成容性耦合 这个耦合到的能量通过人体流入大地 而人体是带电阻的
  • 最全的目标检测与跟踪发展文献综述

    实时目标检测技术作为计算机视觉领域的重要研究方向之一 他在军事侦察 视频监控 智能战斗等领域有着重要的应用场景 随着深度学习的发展和硬件水平的提升 各种深度学习的算法对于航空影响的自动化起到了巨大的推动作用 基于深度神经网络的视觉算法通过自
  • 装饰者模式---装饰者模式和桥接模式的区别

    装饰者模式 什么是装饰者模式 动态将职责附加到对象上 若要扩展功能 装饰者提供了比继承更具弹性的代替方案 装饰者模式又称为包装模式 它主要是为了扩展对象的功能 包装类通过持有对象的引用 将对象传到包装类里面 聚合 把对象包装起来 可以在调用
  • 【数学建模】灰度预测之关联度求解

    灰度预测适用范围 在实际中 若得到的是离散的 规律性不强的数据 此时线性回归就不适用了 我们需要采用灰度预测的方法 灰度预测法则是一种对含有不确定因素的系统进行预测的方法 白色系统 黑色系统 灰色系统 白色系统 指一个系统的内部特征是完全已
  • TP6关于hasOne的用法

    TP6关于hasOne的用法 实际操作中看如下案例 文章分类表 CREATE TABLE case category id bigint 20 unsigned NOT NULL AUTO INCREMENT COMMENT 主键id na
  • GO语言网络编程(并发编程)Channel

    GO语言网络编程 并发编程 Channel 1 Channel 1 1 1 Channel 单纯地将函数并发执行是没有意义的 函数与函数间需要交换数据才能体现并发执行函数的意义 虽然可以使用共享内存进行数据交换 但是共享内存在不同的goro
  • hmcl启动器安装游戏版本失败_有关HMCL的个人粗糙介绍

    简单介绍关于HMCL Hello Minecraft Launcher 受欢迎的 Minecraft 启动器的使用 github https github com huanghongxun HMCL releases 1 使用前的一些调试
  • 「问题记录|VirtualBox」OSX系统启动就异常退出的问题

    背景说明 需要一个OSX系统进行软件打包 原本想在docker中进行 奈何电脑配置不够格 所以还是回归VirtualBox的怀抱 这里记录一个小操作 问题描述 虚拟机启动后加载完毕后闪退 快到甚至有可能没看到窗口 然后就看到侧边列表的虚拟机
  • Python USB通讯

    1 下载libusb 地址 Releases libusb libusb GitHub 下载7z压缩包文件到本地 解压后将32位版本的dll文件拷贝到C Windows System32 64位的dll文件拷贝到C Windows SysW
  • pytorch中的二分类及多分类交叉熵损失函数

    本文主要记录一下pytorch里面的二分类及多分类交叉熵损失函数的使用 import torch import torch nn as nn import torch nn functional as F torch manual seed
  • bin目录下存放的是什么文件?

    bin文件夹通常里面都是什么文件 经常使用电脑系统安装程序的朋友可能会发现 很多软件在安装后都会产生一个bin文件夹 那么bin文件夹是什么 里面大多放着什么文件呢 下面我们来学习一下 避免一些错误的认知导致程序损坏等误操作 软件的安装后文
  • activiti5.17.0流程图及节点显示

    引用 activiti流程图上获取各节点的信息获取 这篇文章写得很好 揭示了图片点击出现信息的方法 于是我也做了 只不过有些改动 可能是activiti的版本不同的原因 jsp页面 通过流程实例id进行操作
  • 【从嵌入式视角学习香山处理器】四、Chisel语言基础

    文章目录 一 前言 二 Linux上对scala工程的操作 1 helloworld执行命令 2 有多个工程目录时 需要切换工程 3 编译报错 4 给vscode的scala插件设置JAVA HOME路径 三 ch4 基本组成部分 ch4
  • 第二章实验1

    周末没事正好练习下 前边 r原以为是只查看cpu寄存器内容 原来还有修改的意思 只用r即查询 用r 寄存器 则是修改该寄存器 不只是可以修改ax 可以修改其他寄存器 d 段地址 偏移地址 查看内存内容 最左边是每行的起始地址 中间是从指定内
  • dev-tool安装方法(手动安装版)

    记录一下vue调试神器dev tool的安装过程 由于是在公司内网 也不方便挂梯子 所以手动安装 下载源码在本地编译 再添加扩展程序的方式安装 过程如下 一 dev tool源码获取 git地址 https github com vuejs