Vue的devtools安装教程

devtools是一个便于开发者调试Vue代码的插件

1. 先确保你已经安装了node.js

2. 点击此处去github上拉取工具包
   

3. 安装yarn（用npm在打包的时候会失败，使用yarn可以打包成功）
   ① cmd输入：npm install -g yarn 全局安装yarn包管理工具
      
   ② 进入devtools文件夹，cmd输入：yarn install 安装依赖（时间挺长，耐心等待）
   

4. cmd输入：yarn run build 打包
   ① 如果使用npm run build打包的话，会报错如下，要求使用yarn run build来打包
   
   ② 那么我们就使用yarn来打包
   

5. 打包成功之后，进入packages/shell-chrome，记事本打开manifest.json文件，将persistent改成true，保存
   

6. 打开chrome浏览器，找到更多工具 => 扩展程序，点击加载已解压的扩展程序
   

7. 选择packpages下的shell-chrome文件夹
   

8. 这样就添加成功了
   

9. 打开一个引入了Vue.js的html页面，F12就能看到增加了一个Vue的选项，以后在编写Vue代码的时候，可以在这里快速的调试代码