Vue工具篇-1、关于安装vue.js Vue-Devtools过程

@[TOC]Vue工具篇-1、关于Windows环境下安装vue.js Vue-Devtools过程

一、安装Node.js和yarn

1、进入Node.js官网https://nodejs.org/en/download/，选择版本下载 2、然后一路一直点击安装即可，安装路径可以自定义选择 3、安装完成后，打开cmd,输入命令 node --version 出现如下页面即安装成功 --------------------------------- 我是一条分割线。。。。------------------------------

4、打开cmd,输入npm install -g yarn安装yarn 5、安装完成后，查看yarn版本号 yarn --version

二、安装Vue-Devtools

1、进入Vue官网https://cn.vuejs.org/，在生态系统下点击Devtools 2、页面跳转到GitHub，点击下载zip包 3、下载完毕后解压到文件夹，我这里是解压到自己创建的文件夹

4、然后进入到Vue-devtools-dev目录下，按住shift键，右键打开powershell窗口 5、输入yarn install,开始安装，我这里已经安装过了，就不贴图了 6、再接下来输入yarn run build，等待安装后，出现如下页面即安装成功 7、打开文件夹，进入到\vue-devtools-dev\packages\shell-chrome目录下，打开manifest.json文件，修改 “persistent”: false 为 “persistent”: true 8、打开Google Chrome，进入扩展程序，打开开发者模式，点击加载已解压的扩展程序，选择\vue-devtools-dev\packages\目录下的shell-chrome文件夹 9、安装完成

三、使用 Vue-devtools调试

1、在浏览器打开调试项目，我这里随便写了个测试页面，打开控制台，点击图中的Vue,即可进行调试