MDX and typescript?

[frankandrobot]

Is there a way to get type safety in an MDX file?
Ideally, there should be type errors either in the IDE or at build time.
To clarify here's a sample MDX:

export function Component(props : {src: string}) {
  //...
}

import { Component } from './component';

# Hello world

There should be some sort of build/IDE error here since it's missing the src property:

<Component/>

[ChristianMurphy]

There is inside typescript files.
For version 1 see https://github.com/mdx-js/mdx/blob/v1.6.22/docs/advanced/typescript.mdx
For version 2 https://github.com/mdx-js/mdx/blob/v2.0.0-next.9/docs/advanced/typescript.mdx

As for type checking inside MDX files themselves, mdx-js/mdx-analyzer#165 and https://github.com/mdx-js/eslint-mdx are where this could live, but it has not been built out yet.
Contributions adding support or financial support to help move the effort forward are welcome!

[marti6jm]

Out of curiosity is this still the case today? (August 10th, 2021)
Looking at the links provided here to the vscode and eslint plugins, I honestly could not tell if they do or don't support typescript.

[ChristianMurphy]

It is still the case

[danmarshall]

Hello is there a 2024 update?

[ChristianMurphy]

Welcome @danmarshall! 👋
The selected answer has links to where you can find the answer to your question, click them and see the answer 🙂