reactjs - React-test werkt niet met Vite + Vitest

Ik krijg de volgende foutmelding bij het uitvoeren van npm test (dat vitest aanroept):

FAAL src/Applications/components/ApplicationsTable/ApplicationsTable.test.tsx [ src/Applications/components/ApplicationsTable/ApplicationsTable.test.tsx ] Fout: Directory-import '{internalNpmPackage}/build/components' wordt niet ondersteund bij het oplossen van ES-modules geïmporteerd vanuit {internalNpmPackage}/build/index.js ⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯ Geserialiseerde fout: { code: 'ERR_UNSUPPORTED_DIR_IMPORT', url: 'file:///Users/me/{myProject}/node_modules/{internalNpmProject}/build/components' }

Waar 'internalNpmPackage' een intern npm-pakket is (gedeelde react-componenten bibliotheek) en 'myProject' het react-project is dat ik test.

Het project draait goed met Vite, het is alleen bij het testen dat ik dit probleem krijg.

Het 'internalNpmPackage' is een verzameling van react-componenten die worden geëxporteerd, en worden correct geïmporteerd bij het draaien van het project.

Ik gebruik React, TS, Vite en Vitest.

Wanneer ik deze pakketten lokaal koppel (met Yalc, vergelijkbaar met npm link - het werkt prima)

Antwoord #1

Probeer de directory-index te importeren als dit nog niet is gedaan. Als uw huidige importverklaring is import { component1, component2} from '{internalNpmPackage}/build/components',

probeer het te veranderen in

import { component1, component2} from '{internalNpmPackage}/build/components/index.js'

Verwijs - https://nodejs.org/api/esm.html#mandatory-file-extensions

Als de bovenstaande oplossing niet voor je werkt, deel dan je importinstructie die de fout veroorzaakt, het package.json van het interne pakket en ook de mappenstructuur van je project

Antwoord #2

Het antwoord hierop was om toe te voegen aan de vite-config onder 'test':

server: {
    deps: {
      inline: ['{internalNpmPackage}'],
    },
  },

Volgens de vite-documentatie:

Vite zal ingesloten modules verwerken. Dit kan nuttig zijn om pakketten te behandelen die .js in ESM-formaat leveren (dat Node niet kan verwerken).