vue-tools踩坑日记|vue-tools的安装|vue-tools安装配置指南

vue-tools踩坑日记

插件可以通过以下方式实现
1、github下载源码自己安装npm后build
2、下载build好的文件
这里我打包好放在自己的服务器了，大家自取
http://47.115.146.199:806/chrome.rar

下面是自己下载源码打包的
昨天只是想自己配个浏览器插件工具，结果打包遇到各种问题，看了2个帖子
结合帖子内的内容来调整的冲突之后也试了类似的忽略文件还是不行

--force 会无视冲突，并强制获取远端npm库资源，当有资源冲突时覆盖掉原先的版本。
--legacy-peer-deps标志是在v7中引入的，目的是绕过peerDependency自动安装；它告诉         NPM 忽略项目中引入的各个modules之间的相同modules但不同版本的问题并继续安装，保            证各个引入的依赖之间对自身所使用的不同版本modules共存。

后来参考以下文档

//这位大哥写的非常详细，不过npm run build还是不行
https://blog.51cto.com/liuchenyang0515/6422190
//yarn的使用
https://blog.csdn.net/weixin_44137575/article/details/107771926
//cnpm安装及配置
https://www.jianshu.com/p/f320eb8b8a29
//vue-tools安装教程
https://www.cnblogs.com/furenjian/p/16813515.html

github里面的vue-tools不是全部都能用的，有一些还在测试

目前我下载的是5.1.1
其他版本都因为我的vue脚手架安装不了依赖，要么就是镜像问题，旧的淘宝镜像已经没有证书了，这里我用新的

1、首先去下载5.1.1版本的vue-tools

https://github.com/vuejs/devtools/tree/v5.1.1

（1）在本地克隆仓库或者直接下载压缩包
（2）使用git代码克隆

git clone https://github.com/vuejs/devtools.git

用git的话要切换一下分支，我用的小乌龟切换

然后安装依赖，npm i 会出现安装错误问题
接下来切换淘宝镜像
淘宝镜像安装，这个是旧的地址
npm install -g cnpm --registry=https://registry.npm.taobao.org //旧的,无法使用

npm install -g cnpm --registry=https://registry.npmmirror.com //新的，用这个

然后

cnpm i

然后npm run build是build不了的，要安装安装 yarn 工具

npm install yarn -g
用 yarn 安装依赖 $ yarn install
用 yarn 构建 $ yarn run build

完美解决

接着修改manifest.json 里persistent 字段 为true


在Chrome中 打开地址chrome://extensions/ 将D:\vue\vue-devtools-dev\shells\chrome文件夹拖入Chrome中

至此插件才算安装完成