typescript-plugin does not respect tsconfig.json include

[svallory]

Initial checklist

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

Affected package

@mdx-js/typescript-plugin@0.1.3 and the latest vscode extension (I think)

Steps to reproduce

1. Add "**/*" to the tsconfig's include
2. Set mdx.checkMdx to true
3. Try to import a file that is not a TS or JS file

Here's my tsconfig:

{
  "extends": "astro/tsconfigs/strict",
  "include": [
    ".astro/types.d.ts",
    "**/*"
  ],
  "exclude": [
    "dist"
  ],
  "compilerOptions": {
    "plugins": [
      {
        "name": "@mdx-js/typescript-plugin"
      },
      {
        "name": "@astrojs/ts-plugin",
      },
    ],
    "paths": {
      "@/*": [
        "./src/*"
      ],
      "~/*": [
        "./src/*"
      ]
    }
  },
  "mdx": {
    // Enable strict type checking in MDX files.
    "checkMdx": true
  }
}

Actual behavior

I can only see TS and JS files

Expected behavior

I should see all files matched by tsconfig include

Runtime

node@24 and typescript@5.9

Package manager

bun@1.3.5

Operating system

macOS Sequoia 15.5

Build and bundle tools

Astro

[remcohaszing]

This looks like an Astro issue. But to be sure, I need you to provide a repo with a minimal reproduction.

[svallory]

Hi, @remcohaszing! What a quick response!

I don't get how this could be an Astro issue, since the import suggestions and type-checking in MDX files is done by the mdx extension.

I've actually been working on a fix (and learning about Volar in the process). If I understand it correctly, to be able to import astro components and have the imports type-checked, intellisense and all the niceties, we need to add Astro's Volar language plugin to the LS we are creating, right? I'm doing some progress here with surprisingly very little code.

I've added a new mdx.languagePlugins: string[] option to the tsconfig schema. Each value is expected to be a module specifier that exports a getLanguagePlugin(): LanguagePlugin<string, any>. In the case of Astro, that is @astrojs/ts-plugin/dist/language.js.

I did it like this because, in case you think this is a cool addition, the architecture makes it easy to add support for other languages.

Let me know what you think. I'll update you when I have a branch you can test

[remcohaszing]

It’s cool that you want to learn about Volar, but you seem to be drawing conclusions too fast. We don’t need to add anything related to Astro here. Start by explaining the problem. I need a minimal repository with step-by-step instructions how to reproduce the issue. Let me get you started:

1. Clone link/to/your/repo
2. Run:
   ```sh
   npm install
   ```
3. Open the project in VSCode
4. Open `path/to/problematic/file`
5. Perform the problematic action in this file. Hover? Move cursor? Format? Trigger completions?

### Actual behaviour

Describe what happened

### Expected behaviour

Describe what should happen according to you

[svallory]

Fair enough, @remcohaszing !

1. Clone the repo at svallory/mdx-astro-bug
2. Open the project in VSCode and go to the page.mdx file
3. Try to change the Button import from JsxButton.jsx to Button.astro

This is the result...

1. The astro component does not show up in the list

2. I you enable mdx.checkMdx in the tsconfig...

[remcohaszing]

So it’s as I suspected. Astro doesn’t have a TypeScript plugin, so Astro doesn’t interop with other TypeScript integrations. Instead they integrate TypeScript via a second language server.

I’m not sure why this is still the case. Perhaps @Princesseuh knows. I’m also curious to know why type checking JSX is based on the classic JSX runtime ("jsx": "preserve") instead of the automatic JSX runtime ("jsx": "react-jsx").

---

You need to define the types of *.astro files for MDX to understand them. Create for example types.ts (not .d.ts) with the following content:

declare module '*.astro' {
  export default function(props: any): astroHTML.JSX.Element
}

[github-actions]

Hi! This was closed. Team: If this was fixed, please add phase/solved. Otherwise, please add one of the no/* labels.

[github-actions]

Hi team! Could you describe why this has been marked as external?

Thanks,
— bb

[Princesseuh]

We still use the language server over a plugin because of limitations of plugins that are deal breakers for Astro. IIRC, it's something about script tags that we can't reproduce in the TS plugins. Johnson tried a few times.

I don't remember why it uses jsx preserve, I've expelled some of that knowledge from my mind over the years, ha. Probably something about handling multiple JSX frameworks in the same project.