React 18 error: "./jsx-runtime.js is not exported from package"

[dstroot]

• mdx-bundler version: ^8.0.1
• node version: 16.14.2
• npm version: 8.5

Relevant code or config

• N/A

What you did:

I upgraded to React 18 from 17.0.2

What happened:

NOTE: Also using Next.js version 12.1.2. When I run "build" after upgrading react from 17.0.2 to 18.0 I get the error below:

---

./node_modules/mdx-bundler/dist/client.js
Module not found: Package path ./jsx-runtime.js is not exported from package /Volumes/T7/Code/blog-next/node_modules/react (see exports field in /Volumes/T7/Code/blog-next/node_modules/react/package.json)

Import trace for requested module:
./node_modules/mdx-bundler/client/index.js
./pages/snippets/[slug].jsx

---

Reproduction repository:

Problem description:

React 18 seems to introduce a problem with how jsx-runtime is consumed from React. MDX-Bundler pull request #162 may address this issue already. I am not sure.

Suggested solution:

Maybe test React 18 with Pull Request 162?
Also see similar issue here: hashicorp/next-mdx-remote#250

[schickling]

I was facing the same problem with Contentlayer and found a workaround/solution that works for Next.js:

[dstroot]

@schickling - you rock! Can confirm with a couple twists. First, it didn't work if I had ".js" at the end my require(). Mine works like this:

Second, I needed to now import React and ReactDOM, not typically needed in a Nextjs project:

After that I can build successfully with React 18! What?!! Yup!!

[jamesthesken]

Thank you both for posting those workarounds!

For some reason it is not working as expected on my end. Even with a similar setup as @dstroot.

Did you have to install jsx-runtime through npm?

Edit: Sorry, I had forgot to modify line 17 as you have above...

[dstroot]

@jamesthesken - you do not need to install jsx-runtime. It comes with React, although the issue seems to be that React doesn't export it, or rather exports it as jsx_runtime, not jxs_runtime.js.

[FradSer]

#167 LGTM, upgrade to v9.0.0 works.

[dstroot]

Yes, v9.0.0 fixes the issue. Closing.