My current project is using Vite, Vue3, TypeScript, and Jest for testing purposes.
Within my project, there is a Vue component named Btn.vue, which imports a Variant type from my @/types/index.d.ts. (Please note that the @ alias has been configured in my tsconfig.json, vite.config.js, and
jest.config.js)</p>
<p><strong>Btn.vue</strong></p>
<pre><code><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'
The tests for this component are located in an adjacent spec file and all pass successfully.
Btn.spec.ts
import { mount } from '@vue/test-utils'
import Btn from './Btn.vue'
describe('Btn component', () => {
// ...all the tests
})
However, during the build process using
vue-tsc --noEmit && vite buildnode_modules/@vue/test-utils/dist/interfaces/wrapperLike.d.ts:1:10 - error TS2305: Module '"src/types"' does not export '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"' does not export '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"' does not export 'FindComponentSelector'.
1 import { DefinedComponent, FindAllComponentsSelector, FindComponentSelector, NameSelector, RefSelector } from 'src/types';
It appears that vue-tsc is having issues locating the Vue Test Utils types and is mistakenly referring to my custom types file instead.