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

Question

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.

Sounds like an issue for their tracker. It seems you intended to link to something ("[this issue") but haven't. You're also duplicating the aliases for some reason (@preact/preset-vite ships with this) and your includes isn't meaningfully different from the default either. Both should probably be removed. — rschristian
– rschristian, Commented Apr 1, 2022 at 22:25
Hey @rschristian, I update the post with the issue link, what did you mean with the includes? — Vinicius Cainelli
– Vinicius Cainelli, Commented Apr 4, 2022 at 7:25
Thanks, that issue actually gives a lot of context (and tells you the solution). What I mean about the include is that it's not meaningfully different so there's really no reason to be setting it. This is the default, yours is pretty much the same thing. — rschristian
– rschristian, Commented Apr 4, 2022 at 7:37

rschristian · Accepted Answer · 2022-04-04 07:40:45Z

5

You'll want to run the following:

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

Seems like Vitest cannot effectively alias.

answered Apr 4, 2022 at 7:40

rschristian

3,1701 gold badge12 silver badges26 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

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

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related