第一步，vite 配置
vite.config.ts 文件增加 resolve.alias 配置

import { resolve } from 'path'
export default defineConfig({
  plugins: [vue()],
  resolve: {
    alias: [{ find: '@', replacement: resolve(__dirname, 'src') }]
  }
})

如果“path”有錯(cuò)誤提示， 是因?yàn)?TS 找不到類(lèi)型定義，按照提示安裝 “@types/node”后即可
運(yùn)行命令

npm install --dev @types/node

這時(shí)候已經(jīng)可以使用@別名了

但還不能通過(guò)鼠標(biāo)點(diǎn)擊跳轉(zhuǎn)到定義位置，鼠標(biāo)點(diǎn)擊跳轉(zhuǎn)到定義位置需要在 tsconfig.json 中增加配置

    "baseUrl": ".",
    "paths": {
      "@/*": ["src/*"]
    }

這時(shí)候就可以通過(guò)鼠標(biāo)點(diǎn)擊跳轉(zhuǎn)到方法或變量定義位置