Usage Example?

[biowaffeln]

Hey! I tried setting up this plugin and ran into some issues. I bootstrapped a project with npm init @vitejs/app and added the plugin to vite.config.js:

import reactRefresh from "@vitejs/plugin-react-refresh";
import mdx from "@brillout/vite-plugin-mdx";

export default {
  jsx: "react",
  plugins: [reactRefresh(), mdx],
};

Then I created a simple app.mdx file that I tried to import in main.jsx:

import React from "react";
import ReactDOM from "react-dom";
import App from "./app.mdx";

ReactDOM.render(<App />, document.getElementById("root"));

which gives me an error in the browser window: Uncaught SyntaxError: Invalid or unexpected token (app.mdx). So... what am I missing?

[brillout]

Hi @biowaffeln

You need to instantiate the plugin:

- plugins: [reactRefresh(), mdx],
+ plugins: [reactRefresh(), mdx()],

I will add proper docs later today.

[biowaffeln]

Ohhh right that worked, thanks!

[brillout]

Docs added.