vscode默认不识别@别名，因路径跳转依赖tsconfig.json/jsconfig.json的baseurl和paths配置，仅对import/require语句生效；router.push()等运行时路径需插件支持。
VSCode 默认不识别 @ 别名，也不会为 router.push() 或 <router-link></router-link> 中的路径提供自动补全和跳转支持 —— 必须手动配置 jsconfig.json 或 tsconfig.json，否则所有基于别名的路由跳转都“点不动、补不全、查不到”。
为什么 @/views/xxx 在 import 里能跳转，但在 router.push() 里不能？
因为 VSCode 的路径提示和跳转能力依赖 TypeScript / JavaScript 语言服务的路径解析逻辑，而该服务默认只处理 import / require 语句中的字符串字面量。像 router.push('/user') 或 { name: 'User' } 这类运行时路由调用，不属于模块导入上下文，语言服务不会主动解析。
真正能补全和跳转的，只有明确声明了路径映射且被语言服务“看见”的地方 —— 比如 component: () => import('@/views/User.vue') 中的 @/views/User.vue。
-
jsconfig.json的paths配置只影响类型检查和导入路径解析，不影响运行时行为 - Vue Router 的
name字段跳转（如router.push({ name: 'User' })）无法被静态分析，VSCode 原生不支持补全 - 路径字符串跳转（如
router.push('/user')）必须配合插件才能实现路由路径补全
必须配 jsconfig.json（或 tsconfig.json）才能启用基础路径提示
没有这个文件，@/xxx 在任何地方都不会有补全，包括 import。配置后，import 行内路径能补全、能 Ctrl+Click 跳转，这是后续所有功能的基础。
递归分析 Vue 项目组件依赖，从入口文件生成组件层级图，支持 Vue 2/3，输出组件名、文件路径和属性。适用于分析组件结构、排查依赖或了解项目架构。
在项目根目录新建 jsconfig.json（Vue 2 项目）或确保 tsconfig.json（Vue 3 + TS 项目）包含：
{"compilerOptions": {"baseUrl": ".", "paths": {"@/*": ["src/*"]}}}
- 路径必须是数组，哪怕只有一个映射：
["@/src"]❌，["src/*"]✅ -
baseUrl设为"."才能让paths相对于项目根生效 - Vite 项目也认这个配置，不需要额外装
@volar/vue-language-features就能支持import补全
要让 router.push() 和 <router-link to=""></router-link> 支持路径补全，得装插件
原生 VSCode 不处理这些字符串里的路由路径。目前最稳定可用的是：Auto Import - ES6, TS, JSX, CSS, JSON（带路径补全）或更专精的 Vue Router IntelliSense（注意：仅支持 Vue 3 + createRouter 风格）。
- 启用后，在
<router-link to="/xxx"></router-link>的to属性中输入/，会列出所有已注册的path值 -
router.push('/xxx')同理，但不支持name补全（无运行时路由表反射） - 插件依赖
routes数组可被静态分析 —— 所以不要把路由配置拆成函数调用或动态拼接，例如routes.concat(getAdminRoutes())会导致补全失效
别名跳转失效？先确认 resolve.alias 和 jsconfig.json 是否一致
常见坑：Vite 或 Webpack 配了 alias: { '@': 'src' }，但 jsconfig.json 写成 "@/*": ["./src/*"] 或 "@/*": ["src/"] —— 路径不匹配就跳转失败。
- Webpack/Vue CLI：alias 中的
@指向path.resolve(__dirname, 'src')→jsconfig.json必须写["src/*"] - Vite：默认 alias 是
{ '@': path.resolve(__dirname, 'src') }→ 同样对应["src/*"] - 大小写敏感：Windows 下可能不报错，Linux/macOS 下
Src≠src，跳转会静默失败
最稳妥的做法是打开终端，执行 node -e "console.log(require('path').resolve('./src'))" 看真实路径，再同步到两个配置里。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
