[Vite] typescript + vite 절대경로 설정하기

Vite 사용시 '@/component/Item.tsx' 와 같이 절대경로를 설정하는 방법

 

tsconfig.json과 vite.config.ts 설정이 필요하다.

 

1. @types/node 설치

$ yarn add @types/node

 

2. tsconfig.json 설정

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

 

3. vite.config.ts 설정

// https://vitejs.dev/config/
export default defineConfig({
  plugins: [react()],
  resolve: {
    alias: [{ find: '@', replacement: resolve(__dirname, 'src') }],
  },
})