Chrome安装Vue插件vue-devtools的步骤

Chrome安装Vue插件vue-devtools的步骤

  1. 首先,你需要从 GitHub 上克隆 vue-devtools 的代码库到本地:
bash 复制代码
git clone https://github.com/vuejs/vue-devtools.git
  1. 进入vue-devtools文件夹,并安装依赖包:
bash 复制代码
cd vue-devtools
npm install

或者使用cnpm:

bash 复制代码
cnpm install
  1. 编译代码:
bash 复制代码
npm run build
  1. 修改vue-devtools/shells/chrome/manifest.json文件,将persistent设置为true

  2. 打开Chrome浏览器,在地址栏输入chrome://extensions/进入扩展程序页面。

  3. 打开右上角的开发者模式。

  4. 点击"加载已解压的扩展程序",选择vue-devtools/shells/chrome文件夹。

  5. 勾选"允许访问文件网址"。

  6. 至此,vue-devtools已经安装完毕。你可以在本地运行一个 Vue 项目,然后通过 F12 打开控制台来使用它。如果控制台中没有出现 vue-devtools 面板,可能需要刷新页面或重新打开浏览器。

相关推荐
梅孔立18 小时前
两种免费的翻译API调用方式详解 - Edge官方API与个人缓存服务
前端·缓存·edge
锻炼²5 天前
Edge 地址栏搜索被其他浏览器劫持
前端·edge
特别关注外国供应商11 天前
Claroty Edge 是首创的采集方法,能够快速、无干扰地实现对 信息物理系统(CPS)的可视化
edge·工业网络安全·claroty·ot网络安全·工控系统网络安全·工控数据采集·产线网络安全
qq_2573795919 天前
如何卸载Edge浏览器
前端·windows·git·python·edge·app·浏览器
天疆说19 天前
Zotero Connector 在 Edge 里找不到桌面 Zotero(Linux / Zotero 9.0.6 / Edge 150)
linux·前端·edge
雁鸣零落19 天前
浏览器扩展 CaptionGo,在网页视频上显示双语字幕,支持 PC 和手机端使用
android·chrome·edge·firefox·安卓
LuckyDog阿祥25 天前
卸载Microsoft Edge:EdgeRemover完整操作指南
前端·edge
aaPIXa62225 天前
C++ TensorRT Edge-LLM 边缘推理框架:从原理到实战
开发语言·c++·edge
現実逃避と2 个月前
WIN10 Edge连续关闭多个标签页导致资源管理器崩溃临时解决办法
前端·edge