vue-devtools 开发工具插件之支持vue3 chrome 浏览器插件

当前最新版本:vue-devtools 6.0.0-beta.7

用这个版本主要是为了支持vue3

推荐直接下载 https://www.crx4chrome.com/crx/107268/

本地下载地址

自行构建

https://github.com/vuejs/vue-devtools/releases/tag/v6.0.0-beta.6

安装

安装依赖(这里用npm比较快,记得用淘宝源)

npm install --global windows-build-tools

等等等........
安装完后

npm install

https://github.com/nodejs/node-gyp

构建(这里用yarn)

yarn build

使用

浏览器开启 开发人员模式
加载解压缩的扩展 路径:D:\s\vue-devtools-6.0.0-beta.6\packages\shell-chrome
重启浏览器

到此这篇关于vue-devtools 开发工具插件之支持vue3 chrome 浏览器插件的文章就介绍到这了,更多相关vue-devtools 开发工具内容请搜索我们以前的文章或继续浏览下面的相关文章希望大家以后多多支持我们!

(0)

相关推荐

  • vue-devtools的安装和使用步骤详解

    1.下载压缩包,github下载地址:https://github.com/vuejs/vue-devtools 2.解压此文件夹 3.用命令提示符或编译器进入此文件夹 4.在文件夹下依次运行(可以在命令提示符窗口也可在编译器中): I.npm install安装所需要的依赖 II.npm run build构建(如果未执行此步,shells->chrome文件夹下会缺少build文件夹) 5.在shells->chrome->manifest.json文件中修改 background

  • 通过实例解析chrome如何在mac环境中安装vue-devtools插件

    1之前在windows上装过,最近刚换了个mac本,重新安装下,也是为了记录下我安装的过程. github下载vue-devtool到本地 下载地址https://github.com/vuejs/vue-devtools#vue-devtools 注意,下载的时候默认的是在dev分支,要切换到master,然后克隆到本地(可以先放桌面) 2.将下载的项目文件放入 Chrome浏览器的插件文件夹 在浏览器地址栏输入chrome://version/ 找到路径之后,可以在顶部工具栏"前往"

  • vue-devtools 开发工具插件之支持vue3 chrome 浏览器插件

    当前最新版本:vue-devtools 6.0.0-beta.7 用这个版本主要是为了支持vue3 推荐直接下载 https://www.crx4chrome.com/crx/107268/ 本地下载地址 自行构建 https://github.com/vuejs/vue-devtools/releases/tag/v6.0.0-beta.6 安装 安装依赖(这里用npm比较快,记得用淘宝源) npm install --global windows-build-tools 等等等.......

  • 前端插件库之vue3使用vue-codemirror插件的步骤和实例

    目录 使用 1.命令行安装 2.在需要的组件中配置 配置说明: 个人代码编辑区Demo 总结 vue-codemirror 基于 CodeMirror ,适用于 Vue 的 Web 代码编辑器. 使用 1.命令行安装 npm install vue-codemirror --save // cnpm install vue-codemirror --save 如果运行官网例子时, 报错: @codemirror/lang-javascript@codemirror/theme-one-dark

  • 10 款珍藏已久的 Chrome 浏览器插件(程序员必装)

    Firebug 的年代,我是火狐(Mozilla Firefox)浏览器的死忠:但后来不知道为什么,该插件停止了开发,导致我不得不寻求一个新的网页开发工具.那段时间,不少人开始推荐 Chrome 浏览器,我想那就试试吧,期初我觉得用起来很别扭,毕竟我不是一个"喜新厌旧"的人.但用的次数越来越多,也就习惯了. Chrome 浏览器有一个好处,就是插件极其丰富,只有你想不到的,没有你找不到的,这恐怕是 Chrome 浏览器被众多爱好者钟爱的原因吧.当然了,Chrome 浏览器本身也非常强大

  • 用VueJS写一个Chrome浏览器插件的实现方法

    浏览器基本已经天下大统了,放眼望去都是Chromium的天下.那么,能写一个浏览器插件也算是一种回报率不错的技能. 基本知识 浏览器插件官方的说法叫扩展程序,允许你为浏览器增加各种功能,但不需要深入研究浏览器本身的代码.你可以用HTML,CSS和JavaScript创建新的扩展程序,如果你曾经写过网页,那么写一个插件是非常轻松的事情. 常见的插件一般就是地址栏后面的一个图标,点击后给你当前网页提供各种功能,或者在你点击网页右键时弹出额外的菜单. 程序目录结构 最简单的扩展程序只需要3个文件,或者

  • Vue开发工具之vuejs-devtools安装教程及常见问题解决(最详细)

    目录 一.vue.js插件下载 二.Vue开发工具vuejs-devtools下载 三.Vue开发工具vuejs-devtools安装+使用 四.常见问题解决 这绝对是最详细的Vue开发工具vuejs-devtools安装教程,相信你只需要5分钟即可解决所有问题 vue-devtools是什么? vue-devtools是一款基于chrome游览器的插件,用于调试vue应用,这可以极大地提高我们的调试效率. 一.vue.js插件下载 下载地址:vue.js插件下载: 点击进入Vue官网即可下载,

  • vue+element开发一个谷歌插件的全过程

    简单功能:点击浏览器右上角插件icon弹出小弹窗,点击设置弹出设置页,并替换背景图或颜色. 开始 1.本地创建文件夹testPlugin并新建manifest.json文件 { "name": "testPlugin", "description": "这是一个测试用例", "version": "0.0.1", "manifest_version": 2 } 2.添

  • Visual Studio 2010 前端开发工具/扩展/插件推荐

    怎么样让Visual Studio更好地编写HTML5, CSS3, JavaScript, jQuery,换句话说就是如何更好地做前端开发.Visual Studio 2010不管是旗舰版还是免费版都没有对前端开发方面做充分的优化.不要希望VS默认安装这些东西,我们有很多VS的扩展可是使用. 这里列出的大多数扩展都可以使用Extension Manager (Tools > Extension Manager)来安装,你可以通过Visual Studio Gallery网站下载这些扩展. We

  • 用vue快速开发app的脚手架工具

    前言 多页面应用于结构较于简单的页面,因为简答的页面使用router又过于麻烦.本脚手架出于这样的场景被开发出来. 使用脚手架搭配Hbuilder也同样可以快速使用vue开发安卓和IOS APP. 本文最大特点: webpack4 多页面 跨域Proxy代理 VConsole移动端调试,手机上的开发者工具 es6/es7 babel 转换 项目地址 GitHub 使用手册 MogoH5+ 是一个 vue 多页面 脚手架工具 ,结合 H5+可以快速开发安卓与苹果 APP. 即使不适用 Hbuild

  • SpringBoot + Vue + Electron 开发 QQ 版聊天工具的详细教程

    一.简介 这是一款基于 JS 实现的超轻量级桌面版聊天软件.主要适用于私有云项目内部聊天,企业内部管理通讯等功能,主要通讯协议websocket.也支持web网页聊天实现.文字聊天,互传文件,离线消息,群聊,断线重连等功能. 先看一下效果,下图左边是web版,右边为PC版. 二.本地搭建 2.1 技术栈 后端技术栈: springboot: 让开发人员快速开发的一款Java的微服务框架. tio: 是百万级网络框架oauth2.0: OAuth 2.0 是一个行业的标准授权协议. OAuth 2

  • Vue安装浏览器开发工具的步骤详解

    开发vue时,浏览器有一个好的开发调试工具能让开发事半功倍,磨刀不误砍柴工. 步骤 1.下载工具 地址:  https://github.com/vuejs/vue-devtools 2.安装依赖 cmd进入vue-devtools文件夹,安装相关依赖,依次执行npm install,再执行npm run build. 3.修改配置 打开shells>chrome>src>manifest.json,修改"persistent":false为true. 4.浏览器安装

随机推荐