eastern-cyan•4w ago
Got an error when running dev with PNPM
I got an error when running a Next.js Refine with template app.
The error is:
Failed to compile
../../nodemodules/.pnpm/@refinedev+kbar@1.3.16@refinedev+core@4.57.10_@tanstack+react-query@4.40.1_react-dom@18.3.1__7tmab5jupj4x6bx25rsnw5d7hu/node_modules/@refinedev/kbar/dist/index.mjs:2:1
Module not found: Can't resolve 'kbar'
3 Replies
Hi @regn. I'm kapa.ai, your friendly support bot. I will try to answer your question by searching through the knowledge base. :wave:
----------------------
The error you're encountering—
You are hitting a known compatibility issue with
Module not found: Can't resolve 'kbar' when running a Next.js Refine app with pnpm—relates to compatibility issues between @refinedev/kbar and React 18+/Next.js 14+. The root cause is that @refinedev/kbar depends on the kbar package, which in turn uses react-virtual@2.x, a version not compatible with React 18+. This results in build and runtime errors, including missing module errors like the one you see.
This is a known and currently open issue in the Refine ecosystem. The maintainers have acknowledged that the only workarounds at the moment are to either:
- Remove or comment out the KBar functionality from your app (which means losing the command palette feature), or
- Downgrade to React 17 (not recommended, as you lose React 18 features).
Attempts to override or force compatible versions of kbar or react-virtual do not resolve the issue, as there is no React 18+ compatible version of react-virtual available, and kbar does not yet support it. The recommended solution is for the Refine team to update @refinedev/kbar to use a React 18+ compatible alternative, but as of now, this has not been released. This issue is high priority and affects all users trying to use Refine with React 18+ and Next.js 14+ [Refine/kbar React 18+ compatibility issue].
Summary:You are hitting a known compatibility issue with
@refinedev/kbar and React 18+/Next.js 14+ when using pnpm. There is no official fix yet. The only current workaround is to remove KBar from your app or downgrade React, both of which have significant drawbacks. Please follow the linked issue for updates from the Refine team.
----------------------
Note: you can ask me a follow up question by @ mentioning me again :speech_balloon:
----------------------<@336843331416096768> Kapa.ai is still learning and improving, please let me know how I did by reacting below.
eastern-cyanOP•4w ago
I see