codehike
codehike copied to clipboard
Using Code Hike from React Server Components
Hi,
I'm using this with MDXRemote on NextJS 13 (app directory). When I run it normally, I get this error:
./node_modules\@code-hike\mdx\dist\components.esm.mjs
ReactServerComponentsError:
You're importing a component that needs unstable_batchedUpdates. It only works in a Client Component but none of its parents are marked with "use client", so they're Server Components by default.
,-[C:\...\node_modules\@code-hike\mdx\dist\components.esm.mjs:1:1]
1 | import React, { createContext, useCallback, useContext, useMemo } from 'react';
2 | import { unstable_batchedUpdates } from 'react-dom';
: ^^^^^^^^^^^^^^^^^^^^^^^
3 |
4 | /******************************************************************************
4 | Copyright (c) Microsoft Corporation.
`----
Maybe one of these should be marked as a client entry with "use client":
./node_modules\@code-hike\mdx\dist\components.esm.mjs
./components\Blog.tsx
./app\blog\[slug]\page.tsx
however when I add "use client"; to the Blog Component, I then get this error:
./node_modules/@code-hike/lighter/dist/index.esm.mjs:449:0
Module not found: Can't resolve 'fs'
https://nextjs.org/docs/messages/module-not-found
Import trace for requested module:
./node_modules/@code-hike/mdx/dist/index.browser.mjs
./components/Blog.tsx