How do add remarkGfm to a remote-compiled MDX in next 14?

Question

I have a method which is remotely collecting and compiling MDX files from a separate directory:

export const getPostBySlug = async (slug: string) => {
    const realSlug = slug.replace(/\.mdx$/, '')
    const filePath = path.join(rootDirectory, `${realSlug}.mdx`)

    const fileContent = fs.readFileSync(filePath, { encoding: 'utf8' })
    const { frontmatter, content } = await compileMDX({
        source: fileContent,
        options: { 
            parseFrontmatter: true,
            mdxOptions: {
                remarkPlugins: [remarkFrontmatter, remarkGfm],
                rehypePlugins: []
            }
        },
    })

    return { meta: { ...frontmatter, slug: realSlug }, content }
}

Calling this and trying to render the content makes the page crash with:

Error: [next-mdx-remote] error compiling MDX: Cannot set properties of undefined (setting 'inTable')

I tried downgrading to remark-gfm v3.0.1 as specified in this post, but it only leads to the program crashing with another error:

./content/gh-test.mdx
TypeError: gh-test.mdx:TypeError: this.setData is not a function
    at new Promise (<anonymous>)

I have also noticed that not including remarkGfm in my MDX compilation function, but including it in the next.config.mjs file renders the mdx correctly and applies the plugin, but only if I manually import that file. For example, importing the file like this in my page.tsx solves the issue:

import Ghtest from "../content/gh-test.mdx";
...
return <Ghtest />

I am looking for a solution which allows me to dynamically add my pages under content/[slug], while keeping the remarkGfm functionality.