vue2 devtools安装 vue3 devtools安装

重装系统后跑vue2项目时没有devtools调试工具，打算装一下，想着按照之前安装的经验应该很快能搞定呢，结果捯饬了一个小时终于装上了，原因是dev-tools本地安装依赖时总是报错 

我本地node版本是17.x.x，也不知道是不是网络受限制，从github上我只能找到devtools的版本都是7.x.x,down下来npm install时发现总是报错， 如下图，看着像是版本冲突问题，卸载了 然后通过安装其他版本的devtools 更换node版本 各种尝试发现都不能成功，于是放弃这种方式，通过直接npm install vue-devtools 方式安装插件

下面是安装vue2对应的dev-tools

新建文件夹 devtools，通过vscode打开并安装依赖 npm i vue-devtools

在浏览器中添加扩展程序，选择路径为新创建的文件夹下对应文件夹，并设置点亮图标

本地项目跑起来的时候会发现图标点亮

vue2那些老项目跑起来 可以使用dev-tools进行调试了，还有些vue3的项目没法用devtools调试，也安排上吧

vue3安装dev-tools 直接在项目中添加依赖就行 挺简单的

安装插件在vite.config.ts中进行配置就可以了

npm i vite-plugin-vue-devtools  安装插件

import VueDevTools from 'vite-plugin-vue-devtools'


		plugins: [
			VueDevTools(),
			.....
        ]

把vite vue3项目跑起来，可以通过页面下方小按钮可以显示调试界面