vue-devtools安装【chrome浏览器】

官网下载

guthub地址：vue-devtools
如果可以科学上网，那可以直接安装chrome插件，地址在github中也有给出： chrome商店
如果不能科学上网，那就离线安装吧。

常用下载方法就是下面图标识的两种，方法一适合Git已经安装的朋友，方法二会下载一个压缩包。

下载方法一 git clone

• 创建一个空的文件夹（或者选择一个文件夹），右键选择Git Bash Here,如果没有就是你没有安装Git，去下载方法二
• 复制网页clone下的那一串
• 在Git命令行输入指令：git clone https://github.com/vuejs/vue-devtools.git
• 等待下载成功

下载方法二 压缩包

• 直接点击Github中的Download Zip，找个地方存下来解压

安装

官方教程上有给出方法~ 亲测有效~

我是用的是yarn方法

安装yarn

参考地址：yarn的安装和使用

npm install -g yarn --registry=https://registry.npm.taobao.org

设置下镜像源

yarn config set registry https://registry.npm.taobao.org -g
yarn config set sass_binary_site http://cdn.npm.taobao.org/dist/node-sass -g

配置

• 从目标文件夹进入cmd命令窗口，快捷方法如图所示
  
• 在命令行依次敲入 yarn install 和 yarn run build
• 运行完成后进入chrome浏览器的设置部分。依次点击更多工具...、扩展程序进入页面
  
  
• 选择文件夹： vue-devtools/packages/shell-chrome/
• 添加成功，可以找一个带有vue的文件进行查看啦
  

参考链接

【vue-devtools】https://github.com/vuejs/vue-devtools
【yarn的安装和使用】https://blog.csdn.net/yw00yw/article/details/81354533