Type 'Plugin' is not assignable to type 'PluginOption'.

[Asjas]

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/rollup 3.1.1

Steps to reproduce

In the latest version of Vite 7.1.9 the latest version of @mdx-js/rollup 3.1.1 throws a plugin type error.

Actual behavior

In the latest version of Vite 7.1.9 the @mdx-js/rollup throws the following type error.

No overload matches this call.
  The last overload gave the following error.
    Type 'Plugin' is not assignable to type 'PluginOption'.
      Type 'Plugin' is not assignable to type 'Plugin$1<any>'.
        Types of property 'transform' are incompatible.

Expected behavior

There should be no type error. For now I am casting the plugin to the type PluginOptions from vite.

import type { PluginOption } from "vite";

mdx({
  remarkPlugins: [remarkGfm],
  rehypePlugins: [
    rehypeHighlight,
    rehypeSlug,
    [
      rehypeAutolinkHeadings,
      {
        behavior: "wrap",
        properties: {
          className: "no-underline scroll-mt-40",
        },
      },
    ],
  ],
  providerImportSource: "@mdx-js/react",
  include: ["**/*.mdx"],
}) as PluginOptions,

Runtime

node@24.9.0

Package manager

pnpm@10.18.0

Operating system

Fedora Workstation 42

Build and bundle tools

Vite

[wooorm]

hey! Can you narrow it down?
a) remove plugins that do not affect the error
b) is it possible to expand the type error? can you somehow see what is up exactly with transform?

(p.s. className should be an array of strings!)

[Asjas]

This is the full type error.

No overload matches this call.
  The last overload gave the following error.
    Type 'Plugin' is not assignable to type 'PluginOption'.
      Type 'Plugin' is not assignable to type 'Plugin$1<any>'.
        Types of property 'transform' are incompatible.
          Type 'Transform' is not assignable to type 'ObjectHook<(this: TransformPluginContext, code: string, id: string, options?: { ssr?: boolean | undefined; } | undefined) => TransformResult | Promise<...>, { ...; }> | undefined'.
            Type 'Transform' is not assignable to type '(this: TransformPluginContext, code: string, id: string, options?: { ssr?: boolean | undefined; } | undefined) => TransformResult | Promise<...>'.
              Type 'Promise<SourceDescription | undefined>' is not assignable to type 'TransformResult | Promise<TransformResult>'.
                Type 'Promise<SourceDescription | undefined>' is not assignable to type 'Promise<TransformResult>'.
                  Type 'SourceDescription | undefined' is not assignable to type 'TransformResult'.
                    Type 'SourceDescription' is not assignable to type 'TransformResult'.
                      Type 'SourceDescription' is not assignable to type 'Partial<SourceDescription>'.
                        Types of property 'ast' are incompatible.
                          Type 'AcornNode | undefined' is not assignable to type 'ProgramNode | undefined'.
                            Type 'AcornNode' is not assignable to type 'ProgramNode'.
                              Type 'AcornNode' is missing the following properties from type 'Omit<Program, OmittedEstreeKeys>': sourceType, bodyts(2769)
index.d.ts(3057, 18): The last overload is declared here.

I've also removed all other plugins.

import mdx from "@mdx-js/rollup";
import rehypeAutolinkHeadings from "rehype-autolink-headings";
import rehypeHighlight from "rehype-highlight";
import rehypeSlug from "rehype-slug";
import remarkGfm from "remark-gfm";
import { defineConfig } from "vite";

export default defineConfig({
  plugins: [
    mdx({
      remarkPlugins: [remarkGfm],
      rehypePlugins: [
        rehypeHighlight,
        rehypeSlug,
        [
          rehypeAutolinkHeadings,
          {
            behavior: "wrap",
            properties: {
              className: ["no-underline", "scroll-mt-40"],
            },
          },
        ],
      ],
      providerImportSource: "@mdx-js/react",
      include: ["**/*.mdx"],
    }),
  ],
});

Even if I just pass MDX (no remark or rehype plugins) I get the same.

[remcohaszing]

I am unable to reproduce this issue. Likely either your transient dependency on either acorn or @types/estree is outdated. Remove your node_modules and lockfile and run pnpm install again. If that doesn’t fix it, provide a minimal reproduction.

[github-actions]

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