Path Intellisense 是 VSCode 中自动补全各类文件路径的轻量插件,支持 HTML/CSS/JS/TS 中的路径属性与导入语句,可配置别名映射、语言启用范围及排除目录,提升大型项目路径输入效率。

Path Intellisense 是 VSCode 中一个轻量但极其实用的插件,它能自动补全文件路径(包括相对路径、绝对路径、CSS/SCSS 中的图片路径、JS/TS 中的 import 路径等),省去手动输入和反复切换文件夹的麻烦,尤其在大型项目中效率提升明显。
自动识别并补全各类路径
插件默认监听常见的路径属性和导入语句,比如:
- HTML 中的 src、href 属性
- CSS/SCSS 中的 url() 和 @import
- JavaScript/TypeScript 中的 import、require、new URL() 等
只要光标落在引号内且内容符合路径格式(如以 ./、../ 或 / 开头),就会触发智能补全。
支持自定义路径根目录
默认以当前工作区根目录为起点,但可通过设置调整:
- 在 settings.json 中添加 "path-intellisense.mappings" 配置别名映射
- 例如把 @/ 指向 src/,就能在 import 中直接写 import X from '@/components/X.vue' 并获得补全
- 支持通配符和多级映射,适配 Vue、React、Webpack 别名等常见工程配置
按需启用或禁用,不干扰其他功能
插件默认开启,但可灵活控制:
- 在特定语言中关闭:通过 "path-intellisense.enabledLanguages" 白名单管理
- 忽略某些文件夹:用 "path-intellisense.excludedItems" 排除 node_modules、dist 等无需补全的目录
- 补全时显示文件图标、区分文件与文件夹,视觉反馈清晰,减少误选
基本上就这些。它不复杂,但容易忽略——装上之后,敲路径再也不会靠猜、靠切窗口、靠查文档了。










