場景：我們在利用VS code開發(fā)的時(shí)候吭历，經(jīng)常需要引入一個(gè)文件、圖片等擂橘，這時(shí)候我們會(huì)下載（path-intellisense）等插件來獲得路徑的提示，沒錯(cuò)摩骨，這確實(shí)很方便通贞，但是我們在利用webpack構(gòu)建腳手架開發(fā)的時(shí)候朗若，或者說用vue開發(fā)的時(shí)候，我們會(huì)利用到路徑別名這么一個(gè)理念昌罩，就是說 我們可以設(shè)置一個(gè)變量 比如 @ 來表示一個(gè)相對(duì)路徑的文件目錄哭懈，已達(dá)到好看，或簡寫的效果（vue 官方十分推薦茎用。）但是這里我們就出現(xiàn)了一些問題遣总。
問題一：如果我們用了路徑別名（@）等，那么我們的插件（path-intellisense）將不支持自動(dòng)提示轨功。
解決辦法：
很容易推論得出我們應(yīng)該在插件中配置別名（@）的映射旭斥。如圖
插件截圖
我們對(duì)這個(gè)插件的mappings設(shè)置如下。
"path-intellisense.mappings": {
"@": "${workspaceRoot}/src"
}
問題二：我們希望 Ctrl + 鼠標(biāo)左鍵點(diǎn)擊一個(gè)外部方法時(shí)古涧，能夠快速跳轉(zhuǎn)到對(duì)應(yīng)的外部文件垂券。
很多人說 webstorm 都可以。那我告訴你 VS code 也可以羡滑，vs code不比任何一個(gè)前端開發(fā)編輯器差菇爪。只是你的使用方法不對(duì)。同樣的原因柒昏，之所以不能跳轉(zhuǎn)凳宙，也是因?yàn)槁窂絼e名（@）不能被 VScode 識(shí)別，所以你同樣需要在vs code 里面做映射
解決辦法：
在項(xiàng)目package.json所在同級(jí)目錄下創(chuàng)建文件jsconfig.json,寫上如下配置职祷。
{
"compilerOptions": {
"target": "ES6",
"module": "commonjs",
"allowSyntheticDefaultImports": true,
"baseUrl": "./",
"paths": {
"@/*": ["src/*"]
}
},
"exclude": [
"node_modules"
]
}
