Testing (ExpressJS + TypeScript + Vitest): tsconfig setup not working in Visual Studio Code

Viewed 205

I'll just jump straight into it with an example:

I have the following (simplified) project structure:

src/
    app.ts
test/
    integration/
        example.spec.ts
    tsconfig.json
tsconfig.json

The root tsconfig.json contains following settings:

{
  "extends":"@tsconfig/node16/tsconfig.json",
  "compilerOptions": {
    "rootDir": "./src",
    "outDir": "./build",
    "emitDecoratorMetadata": true,
    "experimentalDecorators": true,
    "resolveJsonModule": true,
    "noEmitOnError": true
  },
  "include": [
    "./src/**/*.ts"
  ]
}

The tsconfig.json inside the tests/ folder contains following settings:

{
  "extends": "../tsconfig.json",
  "compilerOptions": {
    "types": ["vitest/globals"]
  },
  "include": [
    "./src/**/*.ts",
    "./test/**/*.ts",
    "vitest.config.ts"
  ]
}

Now I have basically 2 issues:

  1. Running a basic example test from pnpm works with following script: cd ./test && vitest run. However, in vscode it doesn't seem to parse the inner tsconfig, so I'm always getting type errors inside my IDE:

ide errors 1 ide errors 2

  1. Whenever I want to import app from the src folder, I'm getting following typeORM related errors: app import errors

For the first issue, I'm guessing it's either a bug in vscode or it need to be configured somewhere properly. But I couldn't find much about it. For the second issue, I'm probably missing something (build first, run tests on that build?).

Maybe I'm trying something fundamentally wrong, but then I would like to know how to properly setup a testable ExpressJS TypeScript app.

1 Answers

For now I'm just assuming that vitest can't work with TypeORM since it needs reflect-metadata package and vite (with esbuild underneath) also doesn't work with this package. I'm gonna try again when we migrate away from TypeORM.

Related