【Vue】vite配置 @ 路径别名

目标：配置路径别名 方便后期别名引用

安装 node 的类型声明文件

因为 path 是 node 的内置模块需要先安装 node ts 声明文件

yarn add @types/node -D

vite.config.ts中添加配置

import { defineConfig } from 'vite'
import vue from '@vitejs/plugin-vue'
import path from 'path'

export default defineConfig({
  plugins: [vue()],
  resolve: {
    alias: {
      '@': path.resolve(__dirname, './src')
    }
  }
})

修改tsconfig.json 增加以下配置

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

• 注意：修改完 vite.config.ts 文件需要重启