使用Vite脚手架时遇npm警告及VSCode图标显示问题求助

一、npm废弃包警告问题 #

遇到的警告信息： #

npm warn deprecated inflight@1.0.6: 该模块已不再受支持，存在内存泄漏问题，请勿使用。若需按键值合并异步请求，可使用功能更全面强大的lru-cache。
npm warn deprecated rimraf@3.0.2: Rimraf v4之前的版本已不再受支持
npm warn deprecated glob@7.2.3: Glob v9之前的版本已不再受支持

已添加278个包，29秒内完成279个包的审计。
有103个包寻求资助，可运行npm fund查看详情。

已尝试操作： #

• 安装inflight@latest、rimraf@latest、glob@latest
• 执行npm update

解决方案： #

这些废弃包大多是项目的间接依赖（并非你直接在package.json中声明的），直接安装最新版或执行npm update无法更新这类依赖，可尝试以下方法：

1. 定位依赖来源：执行npm ls inflight rimraf glob，查看这些包是被哪个上游依赖引入的
2. 更新Vite核心包：确保使用最新版Vite，执行npm install vite@latest
3. 清理缓存重装依赖：

   npm cache clean --force
   rm -rf node_modules package-lock.json
   npm install
   

4. 强制指定包版本：在package.json中添加overrides字段，强制间接依赖使用指定版本：

   "overrides": {
     "rimraf": "^5.0.0",
     "glob": "^10.0.0"
   }
   

   注：inflight已完全停止维护，不建议强行覆盖，优先更新引入它的上游依赖到不使用inflight的版本

二、VSCode中Vite图标不显示问题 #

现象：Vite配置文件（如vite.config.js）仅显示JS默认图标，无Vite专属图标

解决方案： #

1. 安装支持Vite图标的插件：推荐安装VS Code Icons或Material Icon Theme，安装后打开命令面板（Ctrl+Shift+P），输入File Icon Theme选择对应主题启用
2. 重置VSCode图标缓存：
   • 打开命令面板，输入Developer: Reload Window重启窗口
   • 或手动删除缓存目录（不同系统路径不同）：
     • Windows: %APPDATA%\Code\CachedData
     • macOS: ~/Library/Application Support/Code/CachedData
     • Linux: ~/.config/Code/CachedData
3. 确认文件语言模式：右键vite.config.js文件，选择Change Language Mode，确认设置为JavaScript或JavaScript (Vite)

环境信息： #

• Node版本：v20.14.0
• npm版本：10.7.0

内容的提问来源于stack exchange，提问作者Res