一、vite.config.ts 设置

import { defineConfig } from 'vite'
import vue from '@vitejs/plugin-vue'
const {resolve} = require('path')

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

vite.config.ts完成上述设置后，可以正常编译运行，但vscode会报错，找不到相应的模块。还需要在tsconfig.json里面进行如下设置

二、tsconfig.json设置

{
  "compilerOptions": {
    "target": "esnext",
    "useDefineForClassFields": true,
    "module": "esnext",
    "moduleResolution": "node",
    "strict": true,
    "jsx": "preserve",
    "sourceMap": true,
    "resolveJsonModule": true,
    "esModuleInterop": true,
    "lib": ["esnext", "dom"],
    "baseUrl": "./",
    "paths": {
      "@":["./src"],
      "@/*":["./src/*"]
    }
  },
  "include": ["src/**/*.ts", "src/**/*.d.ts", "src/**/*.tsx", "src/**/*.vue"],
  "references": [{ "path": "./tsconfig.node.json" }]
}

主要是加上下面baseUrl和paths设置即可

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