Description
Describe the bug
I am using mdx-embed in my nextjs application along with next-mdx-remote package. I have upgraded the next-mdx-remote package to 4.1.0 which has new MDX 2 features. After upgrading I am getting the following error in mdx-embed package
Error: require() of ES Module blog/node_modules/@mdx-js/react/index.js from /node_modules/mdx-embed/dist/components/mdx-embed-provider/mdx-embed-provider.js not supported.
Instead change the require of index.js in blog/node_modules/mdx-embed/dist/components/mdx-embed-provider/mdx-embed-provider.js to a dynamic import() which is available in all CommonJS modules.
Since, MDX 2 migrated to use complete ESM packages, the require
import of mdx-embed is throwing error. Is it possible to compile this package in ESM?
To Reproduce
My branch with the upgraded packages - https://github.com/payapula/blog/tree/feature/next_chakra_upgrades_react_18
- Clone project - https://github.com/payapula/blog
- Checkout - https://github.com/payapula/blog/tree/feature/next_chakra_upgrades_react_18
npm install
npm run dev
- Open - http://localhost:3001/blog/what-is-this-javascript
Expected behavior
There should not be any errors referring to mdx-embed
pacakge
Screenshots
Desktop (please complete the following information):
- OS: macOS
- Browser: chrome
- Version 103
Additional context
I think if we can migrate this project to ESM, we could solve this issue. Any help on this would be appreciated. Also happy to contribute PRs.