TypeScript error in vite.config.ts: 'test' does not exist in type UserConfigExport when configuring Vitest

1 day ago 1

ARTICLE AD BOX

I have been battling this issue for a while now, setting up Vitest in a react and typescript project, vitest does run from the cli but typescript reports an overload error in vite.config.ts

the exact error is:

No overload matches this call.

Object literal may only specify known properties, and 'test' does not exist in type 'UserConfigExport'

The problem occurs when I add the test config to vite.config.ts like so

export default defineConfig({ plugins: [react(), tailwindcss()], test: { globals: true, environment: "jsdom", setupFiles: "./src/tests/setup.ts", css: true, }, });

There is a red squiqqly line on test.

If I try importing defineConfig from vitest/config instead, the error moves to the plugins array.

Here are my current configs:

vite.config.ts

import { defineConfig } from "vite"; import react from "@vitejs/plugin-react"; import tailwindcss from "@tailwindcss/vite"; export default defineConfig({ plugins: [react(), tailwindcss()], test: { globals: true, environment: "jsdom", setupFiles: "./src/tests/setup.ts", css: true } });

tsconfig.node.json

{ "compilerOptions": { "target": "ES2022", "lib": ["ES2023"], "module": "ESNext", "moduleResolution": "bundler", "isolatedModules": true, "noEmit": true, "strict": true, "skipLibCheck": true, "types": ["vitest"] }, "include": ["vite.config.ts"] }

vite-env.d.ts

/// \<reference types="vite/client" /\> /// \<reference types="vitest" /\>

What works

Vitest does run from the CLI

output:

RUN v4.0.18

No test files found

So Vitest itself is installed and executable.

Versions

npm ls vite vitest typescript @vitejs/plugin-react

Output:

[email protected]