TypeScript Errors Caused by vitest Configuration in Vue App Build

[MooseSaeed]

Issue Description:

Encountering TypeScript errors related to the vue-router/auto when building a fresh Vue 3 application created with npm create vue@latest. The errors occur specifically with the createRouter and createWebHistory functions.

Steps to Reproduce:

1. Create a fresh Vue app using npm create vue@latest with the below configuration.

2. Install and configure unplugin-vue-router.
3. Run npm run build.
4. Observe the TypeScript errors in the terminal.

Expected Behavior:

The Vue application should build successfully without any TypeScript errors related to the vue-router/auto.

Actual Behavior:

Encountering TypeScript errors

src/router/index.ts:1:10 - error TS2305: Module '"vue-router/auto"' has no exported member 'createRouter'.

1 import { createRouter, createWebHistory } from 'vue-router/auto'
           ~~~~~~~~~~~~

src/router/index.ts:1:24 - error TS2305: Module '"vue-router/auto"' has no exported member 'createWebHistory'.

1 import { createRouter, createWebHistory } from 'vue-router/auto'
                         ~~~~~~~~~~~~~~~~

Additional Context:

The errors are resolved by removing the path configuration for Vitest from tsconfig.json, which was added automatically during the creation of the Vue app.

    {
      "path": "./tsconfig.vitest.json"
    }

Reproduction Repository:

A reproduction of the issue has been created at: MooseSaeed/tsc-error

[posva]

I’m interested in the resolution of this config issue to add it to docs but it doesn’t seem to be about the code, just a config issue

[MartinX3]

I can confirm this issue with Quasar (based on vue3), but I don't use vitest.

[94726]

I was able to make the npm create vue@latest work by adding
/// <reference types="unplugin-vue-router/client" /> to env.d.ts instead of using the compilerOptions.types inside tsconfig
e.g.

/// <reference types="vite/client" />
/// <reference types="unplugin-vue-router/client" />

[alokVishu]

I'm experiencing the same issue in Vue.js and Vite projects. Has anyone found a solution?

[jonaaldas]

Does anybody have a solution for this? I am still having problems and the solutions listed do not work.

[ultimateshadsform]

For some reason this has stopped working and is generating errors but works fine in browser:

It doesn't generate needed types for some reason.

Edit: Fixed by downgrading to "unplugin-vue-router": "^0.7.0",