chrome浏览器添加vue-devtools扩展

1,在百度网盘中下载压缩包,网盘地址:https://pan.baidu.com/s/1i6UdvCD,密码:nvfe

2,将压缩包解压到F盘,F:\chromeVue插件

3,复制文件地址,F:\chromeVue插件\vue-devtools-master

4,打开cmd命令,进入F盘,然后进入到vue-devtools-master文件中,命令:cd  F:\chromeVue插件\vue-devtools-master

5,在npm中执行命令,(我这边安装了镜像,所以是cnpm)

6,执行 cnpm install

7,执行 cnpm run build.

8,将manifest.json文件打开,找到background中的“persistent”,改为true,文件在这里:F:\chromeVue插件\vue-devtools-master\shells\chrome

9,打开你的谷歌浏览器,在更多工具中点击扩展程序,然后在出现的页面中勾选开发者模式,点击加载你的解压好的包,选择F:\chromeVue插件\vue-devtools-master\shells下的chrome,如图:

10,运行项目,打开chrome的开发者模式F12,就会看到vue扩展,如图

原文地址:https://www.cnblogs.com/sily-boy/p/8283750.html

时间: 2024-11-05 13:33:54

chrome浏览器添加vue-devtools扩展的相关文章

chrome浏览器的VUE调试插件Vue.js devtools

chrome浏览器的VUE调试插件Vue.js devtools 应用商店直接安装 安装成功后在VUE文件打开可以直接调试: 提示效果如下: F12进入调试状态即可: 安装中出现的问题: 插件安装后无法使用,出现vue.js not detected提示的解决办法 找到插件的安装目录: (可以通过id搜索ID:nhdogjmejiglipccpnnnanhbledajbpd) C:\Users\liangsuya\AppData\Local\Google\Chrome\User Data\Def

Chrome 浏览器安装Vue插件方法 (十分详细)

博主最近在研究Vue,无奈新手想安装Chrome的Vue插件,整理下安装流程: 1.首先去github下载vue.zip文件插件(还有npm安装方法这里就不介绍了自行百度) 2.下载后解压 3.然后通过npm下载相关依赖,可能有些同学没有安装npm,博主也是,这里介绍下安装npm的方法. 从node.js中文网站下载node.js,里面包含npm 4.下载完成直接安装,因为博主已安装成功就不截图,验证npm是否安装成功命令,打开CMD输入 node -v npm -v 如果出现对应版本号,说明安

Chrome浏览器扩展 获取用户密码

Chrome 浏览器允许安装第三方扩展程序以扩展浏览器并给浏览器加入新的功能,扩展使用 JavaScript 以及 HTMl 编写并允许互相访问和控制 DOM. 因为允许访问 DOM,攻击者就可以读取表单字段中的内容,包括用户名以及密码字段,这就是让我冒出做这个原型想法的原因. 我这里放出的这个扩展很简单,每当用户提交一个表单时,扩展就尝试去获取用户名与密码字段,通过 Ajax 调用发送一封带有详细登陆信息以及登陆地址的邮件给我,然后正常的处理和提交表单,以免被用户发现.     有些人可能会怀

如何免费正确地使用Chrome浏览器

前几天上班凑巧用了一下Chrome浏览器.哇,这个感觉有点小爽啊.不愧是谷歌公司,这才是我心目中完美的浏览器啊我去! 因为之前一直用的微软Win10的Edge浏览器,其实说实话用起来也还可以,已经比IE不知道好用到哪里去了.加上Edge浏览器又是Win10系统自带的,也免去了每次用新电脑都要重新下载一个浏览器再重新同步书签和设置这些麻烦.直到有一次,大概是2018年左右,Edge浏览器不知道抽了什么风,把我的书签和保存的Cookies信息全部都吞了,完事之后我其他几台电脑上的书签也全部都消失了.

在浏览器上安装 Vue Devtools工具

Vue.js devtools是基于google chrome浏览器的一款调试vue.js应用的开发者浏览器扩展,可以在浏览器开发者工具下调试代码. 1)首先在github下载devtools源码,地址:https://github.com/vuejs/vue-devtools. 2)下载好后进入vue-devtools-master工程 执行cnpm install, 下载依赖,然后执行npm run build,编译源程序. 3)编译完成后,目录结构如下: 修改shells.chrome目录

谷歌chrome浏览器vue调试工具vue-devtools的安装

先导 vue-devtools是一款基于chrome浏览器的插件,用于vue应用的调试,这款vue调试神器可以极大地提高我们的调试效率.帮助我们快速的调试开发vue应用. 第一步: 我们可以先从github上找到vue-devtools的项目,下载到本地.下载vue-devtools链接. 克隆方法:git clone https://github.com/vuejs/vue-devtools.git 第二步: 解压下载好的文件,进入到vue-devtools目录,安装项目所需要的依赖包. 安装

Chrome浏览器扩展程序强制停用的解决方法

http://blog.csdn.net/pipisorry/article/details/37728839 一.加载正在开发的扩展程序 这里以加载一个已有的Chrome扩展程序为例: 把已有的扩展程序(.crx文件)后缀改为.zip,就可以把它解压缩到某个目录,比如将lingoes_chrome_2.1.crx改成lingoes_chrome_2.1.zip并解压到D:\Downloads\Editor\lingoes_chrome_2.1.zip 打开谷歌浏览器 - 工具 - 扩展程序 -

编写一个 Chrome 浏览器扩展程序

浏览器扩展允许我们编写程序来实现对浏览器元素(书签.导航等)以及对网页元素的交互, 甚至从 web 服务器获取数据,以 Chrome 浏览器扩展为例,扩展文件包括: 一个manifest文件(主文件,json格式) 至少一个HTML文件(主题可以没有HTML文件) JavaScript文件 (可选,非必须) 任何其他你需要的文件(比如图片) 将这些文件放在一个文件夹内,并通过浏览器提供的打包程序进行打包,就可以发布使用了. 这里以一个简单的例子,说明 Chrome 扩展的创建和运行过程. 首先创

Google Chrome 浏览器必备扩展(适用于 Brave 和 Vivaldi 等)

// 前提 不同身份不同状态的人们,总是有着不同的上网需求! 浏览器插件,可以大大的扩展浏览器的功能,实现我们的上网需求. 访问 Chrome Web Store 浏览扩展,看到喜欢的就下载试试吧,没有用就立刻删掉吧. (不能访问 Chrome Web Store ,可以搜索 "谷歌访问助手" 或 "蓝灯" 的使用方法) (音乐:Are You Lonely) 下面 根据使用需求,对常用插件进行分类显示: 广告 用户诉求:摆脱烦人广告.恶意软件和跟踪,还我一个清爽网