vue-devtools 安装教程

vue-devtools 安装教程

本文前提条件：已安装nodejs，npm使用淘宝镜像cnpm，chrome浏览器

1. 下载
   https://github.com/vuejs/vue-devtools
   
   

   下载vue-devtools

---

2. 解压安装包
   在项目内打开命令行工具，可在空白处按住shift + 鼠标右键，选择在此处打开命令窗口
   输入cnpm install ，回车，安装项目依赖
   输入cnpm run build ，回车， 打包扩展程序需要的依赖
   

   

   打包完成

3. 加载扩展程序
   打开chrome浏览器，打开扩展程序，可在地址栏直接输入：chrome://extensions/
   打开开发者模式，加载已解压的扩展程序，选择你的vue-devtools解压目录下的 vue-devtools-dev\shells\chrome
   

   

   加载扩展程序

4. 安装完成
   

   

   安装完成

5. 工具使用演示
   打开vue项目，在页面右键检查，选择vue，便可看到调试工具
   

   

   演示

---

90后小生，爱编程，爱运营，文艺与代码齐飞，魅力与智慧共存的全栈开发者一枚。

作者：Anting全栈开发 技术博客：https://www.jianshu.com/u/259b7db6cc20
来源：

学习交流群： 260352626 编程微刊-技术交流④
著作权归作者所有，任何形式的转载都请联系作者获得授权并注明出处。