Live type-checking for MDX — the same checks as the
mdx-tsc CLI, as you type:
- MDX type errors,
{expression}checks, and JSX component props - provided components (
MDXProvider/mdx-components.tsx) - frontmatter typing and value validation against your schema
Use it alongside the official MDX extension
mdx-tsc is additive — it publishes only type/frontmatter diagnostics and nothing else, so it complements the official MDX extension rather than replacing it:
- Keep the official MDX extension installed (highlighting, hover, completion, markdown features, parse errors).
- Install mdx-tsc for the type + frontmatter squiggles.
- In your
tsconfig.json, set"mdx": { "checkMdx": false }so the official extension stops emitting type errors — mdx-tsc owns those now, so they aren't reported twice.
Requirements
Your project needs a tsconfig.json that includes your .mdx files. Frontmatter
schemas are declared in the "mdx" section. See the main
mdx-tsc README.
Develop
From the repo root:
pnpm install
pnpm build # builds the mdx-tsc server, then bundles this extension
Press F5 (Test mdx-tsc extension (playground)) to open an Extension Development Host with the demo project loaded.
The extension and the language server are bundled with esbuild into
dist/extension.js and dist/server.js, so the packaged .vsix is
self-contained. The TypeScript SDK is resolved via @volar/vscode
(typescript.tsdk setting or VS Code's bundled TypeScript), so checking matches
your workspace.
Publishing
Build a .vsix and upload it to the Marketplace manually:
pnpm --filter mdx-tsc-vscode run package
# -> editors/vscode/mdx-tsc-vscode-<version>.vsix