MDXProvider doesn't use the components argument (vite + react 18)

[arlukin]

Am I missing something?

Looks like the MDXProvider is no longer working with the components argument.

This works for me

<MDXProvider >
  <Post components={components} />
</MDXProvider>

This doesnt

<MDXProvider components={components}>
  <Post />
</MDXProvider>

Here is a simple example to reproduce
https://github.com/arlukin/mdx-test

[wooorm]

You don’t need an MDXProvider. If you use an MDXProvider, you must connect it to your bundler here as explained here https://mdxjs.com/docs/using-mdx/#mdx-provider (particularly step 2).

[arlukin]

Thanks for pointing me back to that place. I was reading about it first, but didn't do the correct connection in my head.

The strange thing is that I didn't need that setting in an earlier version of the the packages. Guess something changed or I used a bug before.

This is now my minimum vite.config.js. I hope it works fine in our real project.

import { defineConfig } from "vite";
import react from "@vitejs/plugin-react";
import mdx from "@mdx-js/rollup";

export default defineConfig(({ mode }) => {
  return {
    plugins: [
      react(),
      mdx({
        providerImportSource: "@mdx-js/react",
      }),
    ],
    optimizeDeps: {
      include: ["react/jsx-runtime"],
    },
  };
});

[wooorm]

It changed in v2. The migration docs cover it.
The reason is that it’s no longer required to use such a package.
And that many more frameworks are supported out of the box. Previously React was the default but everyone else had to change it.