关于【Chrome安装DevTools】插件时遇到的【清单文件缺失或无法读取】的错误以及解决方法

时间:2024-03-15 11:25:29

先说一下,因为最近几个新版本build的时候总报错,所以本文安装的devtools版本是5.1.1

链接地址:https://github.com/vuejs/vue-devtools/archive/v5.1.1.zip

解压之后进入根目录,进行以下操作

npm install

npm run build

这个版本进行到这应该是没问题的。

在 vue-devtools-5.1.1/shells/chrome/ 这个路径中你会找到 manifest.json 这个文件,把文件中 persistent 这个属性的值改成true

关于【Chrome安装DevTools】插件时遇到的【清单文件缺失或无法读取】的错误以及解决方法

接下来到最关键的一步!!!

打开浏览器,找到设置页面,进入扩展程序,记得将右上角的开发者模式打开。很多人在这个时候加载已解压的扩展程序时会遇到这种错误

关于【Chrome安装DevTools】插件时遇到的【清单文件缺失或无法读取】的错误以及解决方法

那是因为选择的加载文件夹选错了,很多人选的是 vue-devtools-5.1.1这个源代码文件夹,这个是错的!

应该选择 vue-devtools-5.1.1/shells/chrome 这个文件夹,基本操作如下

关于【Chrome安装DevTools】插件时遇到的【清单文件缺失或无法读取】的错误以及解决方法

关于【Chrome安装DevTools】插件时遇到的【清单文件缺失或无法读取】的错误以及解决方法

关于【Chrome安装DevTools】插件时遇到的【清单文件缺失或无法读取】的错误以及解决方法

关于【Chrome安装DevTools】插件时遇到的【清单文件缺失或无法读取】的错误以及解决方法

关于【Chrome安装DevTools】插件时遇到的【清单文件缺失或无法读取】的错误以及解决方法

完整以上步骤,运行你的Vue项目,再打开控制台,会有关于【Chrome安装DevTools】插件时遇到的【清单文件缺失或无法读取】的错误以及解决方法

安装成功!!