vscode路径映射跳转的配置

第一步

在项目目录下找到jsconfig.json文件,设置下面代码

// {
//   "compilerOptions": {
//     "baseUrl": "./",
//     "paths": {
//         "@/*": ["src/*"]
//     }
//   },
//   "exclude": ["node_modules", "dist"]
// }
//改为
{
  "compilerOptions": {
    "target": "es2017",
    "allowSyntheticDefaultImports": false,
    "baseUrl": "./",
    "paths": {
      "@/*": [
        "src/*"
      ]
    }
  },
  "exclude": [
    "node_modules",
    "dist"
  ],
  "include": [
    "src/**/*"
  ]
}

第二步

Ctrl+Shift+X或者点击编辑器左上角的扩展按钮。
image.png

在插件市场搜索 别名路径跳转,并且安装好

第三步

方案1、按Ctrl+Shift+P,搜索首选项,然后点击首选项:打开设置(json),进入json配置
image.png

方案2、点击编辑器左下角的管理按钮,然后点击设置或者按后面提示的快捷键Ctrl+,(这是本人的,说不定有些人的快捷键不一样。)然后随便找个有在setting.js中编辑的按钮进入
image.png
image.png

"alias-skip.mappings": {
    "@": "/src", //默认只有`@`映射,可以自己添加其他映射,下面的所有映射都是自建的
    "components": [
      "/src/components"
    ],
    "assets": [
      "/src/assets"
    ],
    "components2": [
      "/components"
    ],
    "@2": [
      "@/components"
    ],
  }

配置完成后先重启。然后使用时,按住Ctrl+鼠标左击,点击目标

posted @ 2021-11-05 14:15  SultanST  阅读(482)  评论(0编辑  收藏  举报