Error using @mdx-js/react version 2 with @next/mdx

[aserputov]

Initial checklist

• I read the support docs
• I read the contributing guide
• I agree to follow the code of conduct
• I searched issues and couldn’t find anything (or linked relevant results below)

Affected packages and versions

mdx-js/react

Link to runnable example

No response

Steps to reproduce

There are no steps to reproduce.

Expected behavior

I'm trying to use your package from the last release. Something broken.

Actual behavior

#12 23.53 ./src/pages/about.mdx
#12 23.53 Attempted import error: 'mdx' is not exported from '@mdx-js/react' (imported as 'mdx').
#12 23.53
#12 23.53 info - Collecting page data...
#12 25.75 info - Generating static pages (0/8)
#12 25.77
#12 25.77 Error occurred prerendering page "/error". Read more: https://nextjs.org/docs/messages/prerender-error
#12 25.77 TypeError [ERR_INVALID_URL]: Invalid URL

Runtime

No response

Package manager

pnpm

OS

macOS

Build and bundle tools

Next.js

[ChristianMurphy]

@aserputov could you share a runnable example of what you are seeing?
In the issue form a template of usage with next.js is provided, it does not have the issue you describe https://codesandbox.io/s/github/mdx-js/.github/tree/main/sandbox-templates/mdx-loader-next

It also sounds like you may have used a previous release?
If so you may want to check out the migration guide to see what's needed to use 2.0 https://mdxjs.com/migrating/v2/

[ChristianMurphy]

@aserputov screenshots of the logs aren't a runnable example, nor does it give details needed to replicate the issue.
The details most pertinent would be your package.json file and your next.config.js, which show which of the several mdx integrations you are using, and what version of packages are being used.
Even better put the example into a sandbox such as https://codesandbox.io/s/github/mdx-js/.github/tree/main/sandbox-templates/mdx-loader-next or https://stackblitz.com/github/mdx-js/.github/tree/main/sandbox-templates/mdx-loader-next so that others can run a minimal reproducible example https://stackoverflow.com/help/minimal-reproducible-example

[aserputov]

I will upload it into sandbox.

[aserputov]

@ChristianMurphy https://codesandbox.io/s/silly-frost-ql563
that's the logs I have

[ChristianMurphy]

https://codesandbox.io/s/github/mdx-js/.github/tree/main/sandbox-templates/mdx-loader-next?file=/package.json
that's the logs I have

@aserputov did you copy the link you intended to? That is the original un-modified sandbox link, and it is working without warning or error logs.

[aserputov]

@ChristianMurphy sorry, I updated it .

[ChristianMurphy]

https://codesandbox.io/s/silly-frost-ql563?file=/package.json

I'm not sure how this helps?
It still isn't a reproducible example, you pasted the error logs on top of package.json

[ChristianMurphy]

Looking at https://github.com/Seneca-CDOT/telescope/blob/9cfc73ab1a52b47fd8c0261ddca4b68aa1f9df6c/src/web/next.config.js#L12-L14
I gather that what you are trying to show is an example with @next/mdx?
And when you are attempting to build with mdx 2 there is an error? (Seneca-CDOT/telescope#2793)
Is that accurate?

[aserputov]

Yes. Thanks.

[ChristianMurphy]

Given that @mdx-js/loader is working as expected in the examples.
This appears to be an issue coming from @next/mdx or from a mismatch in versions in your package.json

Check to make sure on the branch that is erroring, that all the @mdx-js/* packages in package.json are on version 2.0.0.

If the issue persists check with the next team, @next/mdx is maintained by the next team, and the project team can be contacted at https://github.com/vercel/next.js (for issues: https://github.com/vercel/next.js/issues, for questions: https://github.com/vercel/next.js/discussions)
The @next/mdx project may need to be updated to support mdx 2.
If that is the case, some work arounds:

• using @mdx-js/loader directly (https://mdxjs.com/packages/loader/ documents this and https://codesandbox.io/s/github/mdx-js/.github/tree/main/sandbox-templates/mdx-loader-next gives an example of how it looks)
• pinning the @mdx-js/ packages to version 1.6.22 until the next team has a chance to support version 2