1. vite.config.ts配置

//方法1
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')
    }
  }
});

//方法2,需要执行npm install -D @types/node

import { defineConfig } from 'vite';
import vue from '@vitejs/plugin-vue';
import { fileURLToPath, URL} from 'node:url';

export default defineConfig({
  plugins: [vue()],
  resolve: {
    alias: {
      '@': fileURLToPath(new URL('./src', import.meta.url))
    }
  }
});

2. tsconfig.json配置

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

注意:如果项目不是单一的 tsconfig.json,而是使用了分包 tsconfig,即有tsconfig.app.json,tsconfig.node.json文件,则需将上述配置在tsconfig.app.json中。

只需配置如上两个文件即可,需重启项目npm run dev,或重启vscode。

成功!

Logo

Agent 垂直技术社区,欢迎活跃、内容共建。

更多推荐