vue学习--组件化开发(二、Vue调试工具)

介绍

vue-devtools 是一款基于chrome游览器的插件，用于调试vue应用

1.进入Vue官网，选择生态系统 > 工具 > Devtools

图片.png

2.在GitHub上克隆下来

图片.png

将vue-devtools clone到本地
git clone https://github.com/vuejs/vue-devtools.git

3.在vue-devtools目录下安装依赖包

cd vue-devtools
npm install

4.编译代码

npm run build

5.修改

vue-devtools/shells/chrome目录下的manifest.json文件，将 persistent改成 true

6.在浏览器中设置

打开chrome，输入chrome://extensions/进入到chrome扩展程序设置页面

打开右上角的 开发者模式

点击 加载已解压的扩展程序 选择 vue-devtools/shells/chrome

image

这样就安装完成了，vue的界面F12就可以看到

image