VScode + Vitest extension auto-creates "typed-router.d.ts"

[JarvisH]

I have the following conditions:

• Pnpm mono-repo.
• VScode with official Vitest extension activated.
• Vitest workspaces via vitest.workspace.ts added to the project root.

When openening or restarting VScode, the Vitest extension seems to trigger the creation of the dynamically generated "typed-router.d.ts" file. This file is added to the project root and contains no routes. In one of the mono-repo projects "unplugin-vue-router" is used and configured and correctly generates its own "typed-router.d.ts" file containing routes.

The VScode output of the Vitest extension looks like this:

[INFO 9:17:43 AM] [v1.16.1] Vitest extension is activated because Vitest is installed or there is a Vite/Vitest config file in the workspace.
[INFO 9:17:43 AM] [API] Running Vitest v3.0.8 (project/vitest.workspace.ts) with "node /Users/myuser/.vscode/extensions/vitest.explorer-1.16.1/dist/worker.js"
[INFO 9:17:43 AM] [API] Resolving workspace configs: vitest.workspace.ts
[INFO 9:17:44 AM] [API] Watching vitest.workspace.ts
[INFO 9:17:44 AM] [VSCODE] Watching editor with pattern **/*
[9:17:45 AM] [VSCODE] File deleted: apps/my-app/node_modules/.vite-temp/vite.config.ts.timestamp-1742804263902-be4f744005ae1.mjs
[9:17:45 AM] [VSCODE] Ignoring file: .git/FETCH_HEAD
----
FILE CREATED HERE >>>>> [9:17:45 AM] [VSCODE] File created: typed-router.d.ts 
----
[9:17:46 AM] [VSCODE] Ignoring file: apps/my-other-app/node_modules/.vue-global-types/vue_3.5_0_0_0.d.ts
[9:17:46 AM] [VSCODE] Ignoring file: apps/my-other-app/vite.config.ts.git
[9:17:46 AM] [VSCODE] File changed: vitest.config.ts
[9:17:48 AM] [VSCODE] Ignoring file: apps/my-app/node_modules/.vue-global-types/vue_3.5_0_0_0.d.ts
[9:17:54 AM] [VSCODE] Ignoring file: packages/shared/node_modules/.vue-global-types/vue_3.5_0_0_0.d.ts
[9:18:00 AM] [VSCODE] File deleted: apps/my-other-app/src/graphql/graphql-env.d.ts.tmp
[9:18:00 AM] [VSCODE] File created: apps/my-other-app/src/graphql/graphql-env.d.ts
[9:18:01 AM] [VSCODE] File changed: apps/my-other-app/src/graphql/graphql-env.d.ts

I am not sure if this is an issue with unplugin-vue-router or Vitest, but what I don't understand is why this file with empty routes is generated in the root:

/* eslint-disable */
/* prettier-ignore */
// @ts-nocheck
// Generated by unplugin-vue-router. ‼️ DO NOT MODIFY THIS FILE ‼️
// It's recommended to commit this file.
// Make sure to add this file to your tsconfig.json file as an "includes" or "files" entry.

declare module 'vue-router/auto-routes' {
  import type {
    RouteRecordInfo,
    ParamValue,
    ParamValueOneOrMore,
    ParamValueZeroOrMore,
    ParamValueZeroOrOne,
  } from 'vue-router'

  /**
   * Route name map generated by unplugin-vue-router
   */
  export interface RouteNamedMap {
  }
}

My system info:

  System:
    OS: macOS 15.3.1
    CPU: (16) arm64 Apple M3 Max
    Memory: 588.39 MB / 64.00 GB
    Shell: 5.9 - /bin/zsh
  Binaries:
    Node: 22.14.0 - ~/.nvm/versions/node/v22.14.0/bin/node
    npm: 10.9.2 - ~/.nvm/versions/node/v22.14.0/bin/npm
    pnpm: 10.0.0 - ~/.nvm/versions/node/v22.14.0/bin/pnpm

Relevant deps of project using unplugin-vue-router:

  npmPackages:
    unplugin-vue-router: 0.12.0 => 0.12.0 
    typescript: ^5.7.3 => 5.7.3 
    vite: 6.2.2 => 6.2.2 
    vue: 3.5.13 => 3.5.13 
    vue-router: 4.5.0 => 4.5.0 

Relevant deps of root package.json:

@vitest/coverage-v8: 3.0.8 => 3.0.8 
    @vitest/eslint-plugin: 1.1.37 => 1.1.37 
    @vitest/ui: 3.0.8 => 3.0.8 
    typescript: ^5.7.3 => 5.7.3 
    vitest: 3.0.8 => 3.0.8 
    vitest-canvas-mock: 0.3.3 => 0.3.3 

[JarvisH]

Another thing which does not work using Vitest workspaces and which has nothing to do with VScode: when running all tests from the project root, the routes array is empty:

import { routes } from 'vue-router/auto-routes'

// routes is an empty array

[posva]

This is probably due to paths resolving differently from the project or the root. In tests, you could also disable the plugin with maybe a process.env.TEST or some environment variable set by vitest

[JarvisH]

Thanks for the quick reply. I could probably reproduce this in Stackblitz, would that help?

[JarvisH]

Ah nevermind, I took your advice and added the correct paths depending on the result of process.cwd() set the root to the directory of the vite config file.

In vite.config.ts:

plugins: [
   VueRouter({
        routesFolder: [
          {
            src: 'src/pages'
          }
        ],
        root: __dirname
      }),
]

Thanks for your help.

[posva]

You can also use a path resolve or join