vite + typescript 절대경로 지정 방법

 

vite + typescript 절대경로를 지정하기 위해서는 아래 두 파일을 건드려줘야한다.

 

vite.config.ts, tsconfig.json

 

1. vite.config.ts

import { defineConfig } from 'vite';
import react from '@vitejs/plugin-react';
import tsconfigPaths from 'vite-tsconfig-paths';

// https://vitejs.dev/config/
export default defineConfig({
  base: './',
  plugins: [react(), tsconfigPaths()],
});

에서 base: './'를 추가하고, vite-tsconfig-paths를 설치하여 pulgins추가해주어야한다. 

 

2. tsconfig.josn

{
  "compilerOptions": {

    "baseUrl": "./src",
    ...
    ,
    },

  "include": ["src", "src/main.tsx", "vite-env.d.ts"],
}

그리고 "baseUrl"에다가 원하는 절대경로를 입력해주면 된다. 

CRA + typescript로 했을 대는 2번만 해주었으면 됐는데, vite로 빌드하면 1번을 해주어야 한다.