reactjs - React-test virker ikke ved brug af Vite + Vitest
Jeg får følgende fejl, når jeg kører npm test (som kalder vitest):
FEJL src/Applications/components/ApplicationsTable/ApplicationsTable.test.tsx [ src/Applications/components/ApplicationsTable/ApplicationsTable.test.tsx ] Fejl: Mappeimport '{internalNpmPackage}/build/components' understøttes ikke ved løsning af ES-moduler importeret fra {internalNpmPackage}/build/index.js ⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯ Serialiseret Fejl: { kode: 'ERR_UNSUPPORTED_DIR_IMPORT', url: 'file:///Users/me/{myProject}/node_modules/{internalNpmProject}/build/components' }
Hvor 'internalNpmPackage' er en intern npm-pakke (delt React-komponentbibliotek) og 'myProject' er React-projektet, jeg tester.
Projektet kører fint med Vite, det er kun under test, at jeg får dette problem.
'internalNpmPackage' er en samling af React-komponenter, der eksporteres, og som importeres uden problemer, når projektet kører.
Jeg bruger React, TS, Vite og Vitest.
Når jeg linker disse pakker lokalt (ved hjælp af Yalc, svarende til npm link - det fungerer fint)
Svar #1
Prøv at importere bibliotekets indeks, hvis det ikke allerede er gjort. Hvis din nuværende import-udsagn er import { component1, component2} from '{internalNpmPackage}/build/components',
prøv at ændre det til
import { component1, component2} from '{internalNpmPackage}/build/components/index.js'Henvis - https://nodejs.org/api/esm.html#mandatory-file-extensions
Hvis ovenstående løsning ikke virker for dig, bedes du dele din import-udsagn, der forårsager fejlen, package.json for den interne pakke samt mappestrukturen i dit projekt
Svar #2
Svaret på dette var at tilføje til vite-konfiguration under 'test':
server: {
deps: {
inline: ['{internalNpmPackage}'],
},
},
Ifølge Vite-dokumentationen:
Vite vil behandle inline-moduler. Dette kan være nyttigt til at håndtere pakker, der leverer .js i ESM-format (som Node ikke kan håndtere).
