安装vue-dev tools vue-dev tools是调试基于google chrome浏览器的vue.js APP应用程序的开发人员浏览器扩展，使您可以在浏览器开发人员工具下调试代码。 前端开发工程师应该很熟悉这个工具。 可以在查看边栏窗格中的页面的同时检查代码。 由于vue是数据驱动的，因此在开发调试中查看DOM结构时可能看不到想要查看的内容。 使用vue-devtools插件可以方便地分析和调试数据结构。 本文重点介绍vue-devtools的安装方法，并给出chrome插件的直接安装方法。 接下来，我们将介绍vue-dev工具的安装。 下载vue-devtools压缩包( crx类型的压缩包)，并直接解压缩到本地目录。 下图：
打开Chrome浏览器，选择“定制和控件”，单击，然后从下拉菜单中选择“更多工具”-“扩展程序”。 下图：
3 .打开右上角的开发者模式，如下图所示。
4 .单击“加载解压缩的扩展程序”按钮，在第一步中选择保存vue-devtools的目录，然后单击“选择文件夹”按钮即可。 自动返回浏览器后，将显示如下图所示。
在Chrome浏览器中访问vue项目并打开调试模式[f12]时，将显示vue选项卡，如下图所示。
