Search code examples
javascriptvitepreacttesting-libraryvitest

Cannot find module 'react' when use third party React UI lib - Vite + Preact


I'm facing this issue in this Vite started repository.

https://github.com/vicainelli/vite-starter

I'm using Vite + Preact + Vitest + Testing Library

If I'm testing any code inside the codebase, it works fine, but If the test runs against some component that uses another component from an external library, I'm getting this error.

⎯⎯⎯⎯⎯⎯ Failed Suites 1 ⎯⎯⎯⎯⎯⎯⎯

 FAIL  src/components/Button.test.js [ src/components/Button.test.js ]
 ❯ Object.<anonymous> node_modules/@mantine/styles/cjs/theme/MantineProvider.js:5:13

Test Files  1 failed | 1 passed (2)
     Tests  2 passed (2)
Error: Cannot find module 'react'
Require stack:
- /home/runner/work/vite-starter/vite-starter/node_modules/@mantine/styles/cjs/theme/MantineProvider.js
- /home/runner/work/vite-starter/vite-starter/node_modules/@mantine/styles/cjs/index.js
⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯[1/1]⎯

This is something similar to this issue, but I'm already using preact/compact, so, I have no idea what I'm doing wrong.


Solution

  • You'll want to run the following:

    yarn add react@npm:@preact/compat react-dom@npm:@preact/compat
    

    Seems like Vitest cannot effectively alias.