Vue调试工具 vue-devtools

vue-devtools是一款基于chrome浏览器的插件,可以帮我们快速调试vue项目

 

vue-devtools手动安装:

  第一步:找到vue-devtools的github项目(https://github.com/vuejs/vue-devtools),并将其clone到本地

  

  

  第二步: 安装项目所需要的npm包:  npm install 

 

  

 

   第三步:编译项目文件 : npm run build

  

   第四步:添加至chrome浏览器

    1. 浏览器输入地址:chrome://extensions ,进入扩展程序页面。

    2. 点击“加载已解压的扩展程序...”按钮,选择vue-devtools-master/shells/chrome 点击确定按钮

 

     

      添加完成后如下:

        

     

vue-devtools 使用:

  添加完vue-devtools扩展程序后,我们在调试vue项目的时候,chrome开发者工具会看到vue一栏,可以看到当前页面vue对象的一些信息。

  

  

    

   

  

posted @ 2018-07-10 13:21  yangkangkang  阅读(143)  评论(0编辑  收藏  举报