[error]Cannot process MDX file with esbuild

[jialouluos]

v10.0.1 bug？

import remarkGFM from 'remark-gfm';
const { code} = await bundleMDX({
		source: source.replaceAll(/\$.*(?<val>[\>\=\<]+).*\$/gm, `{'$<val>'}`),
		mdxOptions(options) {
			options.remarkPlugins = [
				...(options.remarkPlugins ?? []),
				remarkGFM,
			];
			options.rehypePlugins = [...(options.rehypePlugins ?? [])];
			return options;
		},
	});

show:Cannot process MDX file with esbuild [plugin @mdx-js/esbuild]

version @9 is running properly

[bjarkebech]

I had this same error today.

I'm using Remix and had mdx-bundler inside serverDependenciesToBundle in remix.config.js, which was required for v9.x.

Removing it again fixed the issue.

I.e.:

//remix.config.js
serverDependenciesToBundle: [
  /^mdx-bundler.*/", // remove this entry
],

[jialouluos]

I had this same error today.

I'm using Remix and had mdx-bundler inside serverDependenciesToBundle in remix.config.js, which was required for v9.x.

Removing it again fixed the issue.

I.e.:

//remix.config.js
serverDependenciesToBundle: [
  /^mdx-bundler.*/", // remove this entry
],

I removed remark-gfm and it worked, but I need remark-gfm

[jialouluos]

Does the gfm plugin for mdx-bundler(v10) exist in error handling for backquotes? The gfm plugin for mdx-bundler(v9) handles backquotes correctly

[bjarkebech]

We're using remark-gfm in production as well with no issues - are you using mdx-bundler@10.0.1 and remark-gfm@4.0.0?

Here's our full serverDependenciesToBundle - maybe it will work for you 🤞🏻

serverDependenciesToBundle: [
    // MDX:
    /^rehype.*/,
    /^remark.*/,
    /^unified.*/,
    /^unist.*/,
    /^mdast.*/,
    /^micromark.*/,
    "devlop",
    "ccount",
    "markdown-table",
    "zwitch",
    "fault",
    "decode-named-character-reference",
    "longest-streak",
    "character-entities",
  ],

[airtonix]

getting this error when trying to using:

• astro (i dont think this part matters)
• remark-shiki-twoslash, or
• remark-shaku-code-annotate

import {bundleMDX} from 'mdx-bundler'
import { readSync } from 'to-vfile'

import remarkShikiTwoslash from 'remark-shiki-twoslash'

const mdxSource = readSync(`src/components/thing.md`)


const result = await bundleMDX({
  source: mdxSource.toString(),
  mdxOptions (options) {
    options.remarkPlugins = [
       [remarkShikiTwoslash, { theme: "dark-plus" }]
    ]
    return options
  }
  
})

const {code, frontmatter} = result

export { code, frontmatter }

https://github.com/airtonix/shaku-astro-mdxbundler-bug-223

[hxlhxl]

I came to this problem when I write the ill mermaid graph code like this

```mermaid
a -> b
```

after a deep look at the mdx-mermaid plugin process logic

I got no error but the undefined empty result of this function.
It occured to me that maybe something wrong with my mermaid code.
After I chagned to the correct code.

```mermaid
graph TD;
    A-->B;
```

Error disappeard

[gautamankoji]

solution: fixing TypeError: Cannot set properties of undefined (setting 'inTable') in next.js

issue overview

the error occurs when using remark-gfm with next.js, either in the pages router or the app router, the root cause is a version mismatch between remark-gfm and other markdown-related dependencies, such as code highlighters and markdown converters

solution

to resolve this issue, downgrade remark-gfm to a compatible version, instead of using:

"remark-gfm": "^your_version"

downgrade to version 3.0.1:

npm install remark-gfm@3.0.1

or for yarn:

yarn add remark-gfm@3.0.1

after installing the compatible version, restart your development server:

rm -rf .next node_modules package-lock.json yarn.lock
npm install
npm run dev

@remarkjs could you investigate this issue

root cause

the error occurs because mdast-util-gfm-table, a dependency of remark-gfm, is expecting a structure that is not properly defined due to version conflicts, downgrading to version 3.0.1 ensures compatibility with contentlayer and other related markdown utilities

if you encounter similar issues when using mdx or other markdown-based tools in next.js, always verify the compatibility of your markdown processor versions (remark-* packages, rehype-*, contentlayer, etc)

[yehjxraymond]

Had the same issue today, and went deep down the rabbit hole trying every suggestions here and even pinning certain package version like remark-gfm and mdx-bundler manually.

I found out later when I was on the verge of setting everything on fire and move out of mdx that the error happens when I accidentally deleted an entire folder of images several commits ago.

So yes... check if it could be missing images.