vue + ts + vite 设置别名

1、安装依赖

npm i @types/node -D

2、修改vite.config.ts

import { defineConfig } from 'vite'
import vue from '@vitejs/plugin-vue'
import * as path from 'path' // 新增代码

export default defineConfig({
  plugins: [vue()],
  // 新增代码 resolve相关
  resolve: {
    alias: {
      "@": path.resolve(__dirname, "src"),
      "@a": path.resolve(__dirname, "src/assets"),
      "@c": path.resolve(__dirname, "src/components"),
      "@i": path.resolve(__dirname, "src/apis"),
      "@r": path.resolve(__dirname, "src/router"),
      "@u": path.resolve(__dirname, "src/util"),
      "@api": path.resolve(__dirname, "src/apis/modules"),
    }
  }
})

3、修改配置文件tsconfig.json

• 在 compilerOptions 中新增以下配置

    "baseUrl": ".",
    "paths": {
      "@/*": ["src/*"],
      "@s/*": ["src/*"],
      "@a/*": ["src/assets/*"],
      "@c/*": ["src/components/*"],
      "@i/*": ["src/apis/*"],
      "@r/*": ["src/router/*"],
      "@u/*": ["src/util/*"],
      "@v/*": ["src/views/*"],
      "@api/*": ["src/apis/modules/*"]
    },