Why does vue-tsc think it should look for Vue Test Utils types in my custom types file?

1.3k Views Asked by At

I have a simple project built with Vite, Vue3, TypeScript and Jest for testing.

I have a Vue component called Btn.vue that import a Variant type from my @/types/index.d.ts. (Note that the @ alias is configured in my tsconfig.json, my vite.config.js and my jest.config.js)

Btn.vue

<script setup lang="ts">
import { Variant } from '@/types'
// ...the rest of the component
</script>

types/index.d.ts

export type Variant = 'primary' | 'secondary' | 'info' | 'success' | 'warning' | 'danger'

This component has a bunch of tests in an adjacent spec file. The tests run fine and all pass.

Btn.spec.ts

import { mount } from '@vue/test-utils'
import Btn from './Btn.vue'

describe('Btn component', () => {
  // ...all the tests
})

However, when I build the project with vue-tsc --noEmit && vite build I get a bunch of errors like the following (truncated for brevity).

node_modules/@vue/test-utils/dist/interfaces/wrapperLike.d.ts:1:10 - error TS2305:Module '"src/types"' has no exported member 'DefinedComponent'.
1 import { DefinedComponent, FindAllComponentsSelector, FindComponentSelector, NameSelector, RefSelector } from 'src/types';
           ~~~~~~~~~~~~~~~~

node_modules/@vue/test-utils/dist/interfaces/wrapperLike.d.ts:1:28 - error TS2305: Module '"src/types"' has no exported member 'FindAllComponentsSelector'.
1 import { DefinedComponent, FindAllComponentsSelector, FindComponentSelector, NameSelector, RefSelector } from 'src/types';
                             ~~~~~~~~~~~~~~~~~~~~~~~~~

node_modules/@vue/test-utils/dist/interfaces/wrapperLike.d.ts:1:55 - error TS2305: Module '"src/types"' has no exported member 'FindComponentSelector'.
1 import { DefinedComponent, FindAllComponentsSelector, FindComponentSelector, NameSelector, RefSelector } from 'src/types';

It seems that vue-tsc is getting confused as to where it should be looking for Vue Test Utils types and is defaulting to my custom types file for some reason.

1

There are 1 best solutions below

0
On BEST ANSWER

According to this reply to my bug report on the Vue Test Utils Github, the issue stems from relative imports and should be fixed in the next release. I'm using ^2.0.0-rc.18 so that probably means ^2.0.0-rc.19.

In the mean time, adding "skipLibCheck": true, to the compilerOptions in my tsconfig.json made the build work without error.