TS error in defineConfig: 'test' does not exist in type 'UserConfigExport'

[misha-erm]

Hello,

I have some problems with setting up vitest to work with vite and ts...

Here is my vite.config,ts

I added reference types as mentioned in https://vitest.dev/config/#configuration but it didn't help.

Here are my tsconfigs:

tsconfig.json

{
  "compilerOptions": {
    "allowSyntheticDefaultImports": true,
    "esModuleInterop": true,
    "forceConsistentCasingInFileNames": true,
    "isolatedModules": true,
    "jsx": "react-jsx",
    "lib": ["DOM", "DOM.Iterable", "ESNext"],
    "module": "ESNext",
    "moduleResolution": "Node",
    "noEmit": true,
    "resolveJsonModule": true,
    "skipLibCheck": true,
    "strict": true,
    "target": "ESNext",
    "types": ["vite/client", "vitest/globals"],
    "allowJs": true,

    "baseUrl": "./",
  },
  "include": ["./src"],
  "references": [{ "path": "./tsconfig.node.json" }]
}

tsconfig.node.json

{
  "compilerOptions": {
    "target": "ESNext",
    "module": "ESNext",
    "moduleResolution": "Node",
    "composite": true,
    "allowSyntheticDefaultImports": true,
    "forceConsistentCasingInFileNames": true,
    "isolatedModules": true,
    "skipLibCheck": true,
    "strict": true
  },
  "include": ["vite.config.ts", "tests"]
}

Any ideas? Thank you

[james-elicx]

I had the same problem and defining it like this with an arrow function fixed the issue.

export default defineConfig(() => ({
  build: {
    // ...
  },
  test: {
    // ...
  },
}));

[misha-erm]

Yep, yesterday found this solution too. Using function works for me

[ferdicus]

this won't give you autocompletion for the types though... this just gets rid of the error message 😕

[UsamaEjaz0]

Can someone explain why this works?

[jeffvandyke]

@UsamaEjaz0 This works because defineConfig accepts both a UserConfig and a type UserConfigFnObject = (env: ConfigEnv) => UserConfig;, and a function type definition requires only that the returned object minimally satisfy the declared return type, and won't complain if extra properties are present. This is meant to make it easier to reuse a multi-purpose function in a callback that only requires a minimum satisfying type. It's a bit of a workaround here because we should know the full object type, and not allow unknown props, but that's a bit tricky with the "test" config here.

[james-elicx]

Looking at one of my other projects, the following reference at the top of your config file will also fix the issue, instead of needing to use a function.

/// <reference types="vitest/config" />

[AntonOfTheWoods]

But also make sure you have compatible versions of vite and vitest.

[maczyt]

Yes, latest vite should use vitest 3.x

[SiNONiMiTY]

Just merge the UserConfig interface & InlineConfig interface and get the full type safety 🚀

import { defineConfig, type UserConfig } from 'vite'
import type { InlineConfig } from 'vitest/node'

export default defineConfig({
    build: {
        ...
    },
    test: {
        ...
    },
} as UserConfig & { test: InlineConfig })