Vitest 세팅 오류(1)

테스트 코드 관련해서 jest를 자주 들었기 때문에 jest를 세팅해서 테스트 코드를 경험해볼려고 했다.

하지만 번들러 환경이 Vite이기 jest는 호환성이 좋지 않다는걸 import.meta 호출 관련 문제를 통해 알게 되었다.

그래서 호환성이 좋고 jest보다 빠른 vitest를 가지고 테스트 코드를 작성하는 경험을 가져볼려고한다.

그 중 세팅 중 챗지피티도 해결 못한 오류를 다뤄볼려고 한다.

 test: {
      globals: true,
      environment: "jsdom",
    },

테스트 환경을 설정해주는 과정 중 전역변수 사용과 jsdom을 추가를 해주었다.

이 때 test에서

No overload matches this call.
The last overload gave the following error.
Object literal may only specify known properties, and 'test' does not exist in type 'UserConfigExport'.ts(2769)
index.d.ts(3194, 18): The last overload is declared here.
(property) test: {
globals: boolean;
environment: string;
}

이런 오류가 발생했는데

import {defineConfig ,loadEnv } from "vite";



import { loadEnv } from "vite";
import { defineConfig } from "vitest/config";

이렇게 vitest/config 경로를 지정해줘서 해결했다.

왜 이렇게 해야하는가?

Vite 자체는 Vitest 및 그 설정에 대해 아무것도 모르기 때문에 Vitest는 Vite의 설정을 확장하여 Vitest를 사용할 수 있도록 해줘야합니다.