今天使用 pnpm create vue 指令创建 Vue 项目时，发现启动项目后页面正下方出现了一个调试工具，我一两年前创建项目时还是没有这个工具的
后来查阅资料得知：
使用 pnpm create vue 创建的项目之所以会自带 Vue DevTools 的调试提示和连接功能，是因为其底层依赖的 Vite 和 @vitejs/plugin-vue 在开发模式下默认注入了 DevTools 的支持
这个功能是在 Vue 生态和 Vite 插件后续的版本更新中（大约在 2023 年初）加入的，所以一两年前基于 older version 创建的项目自然没有这个功能
这个工具有什么用？
之前我们公司项目非常庞大，找到页面或组件对应的 vue 文件会有点耗时间，通常需要先根据顶部地址栏路径找到对应的路由页面，如果页面组件层层封装，想要找到组件对应的 vue 文件会更麻烦
有了 DevTools 之后，只要鼠标悬浮在元素上，就能自动显示元素在项目中的文件路径，相当方便
当然，以上只是 DevTools 中的一个功能， DevTools 还能很方便地查看 pinia 的状态管理......其他功能大家自己慢慢探索吧
如果你不想使用这个调试工具，那就找到项目的 vite.config.js 文件把以下代码注释掉即可
