'mdast-util-mdx' is expected to be of type CommonJS, which does not support named exports.

[burhanuday]

---

Initial checklist

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

Affected packages and versions: TODO

Steps to reproduce

SyntaxError: The requested module 'mdast-util-mdx' is expected to be of type CommonJS, which does not support named exports. CommonJS modules can be imported by importing the default export.
For example:
import pkg from 'mdast-util-mdx';
const {fromMarkdown, toMarkdown} = pkg;
    at ModuleJob._instantiate (internal/modules/esm/module_job.js:97:21)
    at async ModuleJob.run (internal/modules/esm/module_job.js:143:20)
    at async Loader.import (internal/modules/esm/loader.js:182:24)
    at async bundleMDX (/home/burhanuday/burhan/projects/portfolio-and-blog/node_modules/mdx-bundler/dist/index.js:60:27)
    at async getFileBySlug (webpack-internal:///./lib/mdx.js:83:7)
    at async getStaticProps (webpack-internal:///./pages/blog/[...slug].js:42:16)
    at async renderToHTML (/home/burhanuday/burhan/projects/portfolio-and-blog/node_modules/next/dist/next-server/server/render.js:27:1780)
    at async /home/burhanuday/burhan/projects/portfolio-and-blog/node_modules/next/dist/next-server/server/next-server.js:112:97
    at async __wrapper (/home/burhanuday/burhan/projects/portfolio-and-blog/node_modules/next/dist/lib/coalesced-function.js:1:330)
    at async DevServer.renderToHTMLWithComponents (/home/burhanuday/burhan/projects/portfolio-and-blog/node_modules/next/dist/next-server/server/next-server.js:137:387)

Gets fixed by replacing in /lib/plugin/remark-mdx.js on line 14

import {fromMarkdown, toMarkdown} from 'mdast-util-mdx'

with

import pkg from 'mdast-util-mdx';
const {fromMarkdown, toMarkdown} = pkg;

[wooorm]

What build tools are you using?

[burhanuday]

https://github.com/timlrx/tailwind-nextjs-starter-blog I was trying to use this repo. the xdm package is a dependency of a dependency it's a NextJS project which uses Webpack 5 with the ESM module loader enabled

[wooorm]

This should be reported to Next.js (or perhaps can be configured there, I believe they have some settings for this).

xdm and its dependencies are fine!