VSCode的“Path Intellisense”插件：智能路径补全

Path Intellisense 插件能实时扫描工作区文件结构，自动补全真实存在的相对/绝对路径，支持别名映射、自动加斜杠、隐藏扩展名等自定义设置，并需确保光标在引号内、文件已保存、无插件冲突。

vscode 的 Path Intellisense 插件能自动补全文件路径，尤其在导入模块、引用图片、链接 css/js 时非常顺手——它不是靠猜，而是实时扫描当前工作区的文件结构，给出真实存在的路径选项。

启用后立即生效，无需额外配置

安装插件后重启 VSCode 或重载窗口（Ctrl+Shift+P → “Developer: Reload window”），路径补全就会默认开启。只要你在字符串中输入 red”>引号（'' 或 ""）并开始敲路径，比如 import './ 或 src="./img/，它就会弹出匹配的文件和文件夹建议。

• 支持相对路径（./、../）、绝对路径（/src/，需配合 path-intellisense.mappings 设置）
• 自动区分文件与文件夹，图标清晰可辨
• 按 Tab 或 Enter 确认补全，支持连续补全子目录（输完一级按 Tab，再输斜杠继续）

常用自定义设置（settings.json）

如果项目有别名（如 @/components）或 webpack 别名，基础补全会失效。这时可在工作区或用户设置里加映射：

Gaga

曹越团队开发的AI视频生成工具

1151

查看详情

• "path-intellisense.mappings": { "@": "${workspaceFolder}/src" } —— 输入 @/ 就能展开 src 下的结构
• "path-intellisense.autoSlashAfterDirectory": true —— 补全文件夹后自动加 /，省去手动输入
• "path-intellisense.includeExtensions": false —— 关闭扩展名显示（适合 import 语句中自动省略 .js/.ts）

不兼容或没反应？先检查这几个点

路径补全失灵通常不是插件坏了，而是环境或语法卡住了：

• 确保光标在双引号或单引号内（外部或注释里不触发）
• 确认文件已保存（未保存的临时文件不会被索引）
• 检查是否被其他插件干扰（如某些 ESLint 或 typescript 插件禁用了字符串内补全）
• 大工作区首次启动可能稍慢，等几秒再试；可设 "path-intellisense.showHiddenFiles": true 查看是否漏扫了 .gitignored 文件

基本上就这些。它不复杂，但容易忽略细节——配对好引号、理清根目录、加一两条映射，就能让路径补全稳稳跟上你的开发节奏。