-
Notifications
You must be signed in to change notification settings - Fork 26.9k
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Importing client components in MDX fails in dev mode #56153
Comments
Seems like a regression in v13.4.20-canary.31...v13.4.20-canary.32 I think this is related to #55362, we will have a look! |
I run into that issue using custom components in the useMDXComponents hook. import * as mdxComponents from '@/components/mdx'
import { type MDXComponents } from 'mdx/types'
export function useMDXComponents(components: MDXComponents) {
return {
...components,
...mdxComponents,
}
} If I declare custom components inside the file it works. |
This is happening in v13.5.5 for any client component in MDX for me too. Downgrading to 13.4 for now |
I'm also facing the same issue. Downgrading to 13.4 fixed it |
This may be fixed in the latest canary release of 13.5.7. So far so good! I'm also using the experimental rust compiler in my next config const nextConfig = {
experimental: {
mdxRs: true
}
} Edit: things also seem to work well on the default compiler |
Just tried |
I'm using this custom component instead of import Image, { ImageProps } from "next/image";
export function MdxImage(props: ImageProps) {
return <Image {...props} />;
} |
I tried some versions with this issue in my case. (With App Router) 13.4.12 ~ 13.4.19: No error *) |
This bug still exists in 14.1 |
I can still reproduce it on the latest version of next. Edit: actually, it happens to me, but only when consuming components from other parts of my monorepo 🤔 I'll try to isolate the issue later today |
Hey @ealexhaywood, I was using next js v14.1.4 with app router and configured MDX as per the documentation but was getting error while importing MDX file in a component - after adding |
@pomber Hi, PR #57301 was landed at As there were a few changes in using MDX, opened a PR for the fix to your repro branch. The main changes:
Please check out the MDX docs as it had several updates! |
@victorteokw @t6adev @GrowthWizard @MananTank @ealexhaywood |
@devjiwonchoi Update to latest version, The issue is fixed |
Closing as #57301 fixed this issue. |
This closed issue has been automatically locked because it had no new activity for 2 weeks. If you are running into a similar issue, please create a new issue with the steps to reproduce. Thank you. |
Link to the code that reproduces this issue
https://github.com/pomber/nextjs-mdx-use-client-bug
To Reproduce
next dev
(it only happens in development mode)Current vs. Expected behavior
Fails with this error:
Verify canary release
Provide environment information
$ npx --no-install next info Operating System: Platform: linux Arch: x64 Version: #202309200834 SMP PREEMPT_DYNAMIC Wed Sep 20 09:14:42 UTC 2023 Binaries: Node: 18.18.0 npm: 9.8.1 Yarn: 1.22.19 pnpm: 8.7.6 Relevant Packages: next: 13.5.4-canary.4 eslint-config-next: N/A react: 18.2.0 react-dom: 18.2.0 typescript: 5.1.3 Next.js Config: output: N/A
Which area(s) are affected? (Select all that apply)
App Router, MDX (@next/mdx)
Additional context
I'm having problems using any client component directly from mdx files:
If
./test.js
has"use client"
this fails in dev mode.A workaround is to re-export the
Test
component from a file without"use client"
.The same example works with
next@13.4.19
and fails withnext@13.5.1
.Similar to #52415 but now in v13.5 it happens for every client component.
NEXT-1666
The text was updated successfully, but these errors were encountered: