Merge pull request #19563 from joshwooding/tidy-up-vite-mdx-plugin

Tidy up vite mdx-plugin

code/lib/builder-vite/src/plugins/mdx-plugin.ts

@@ -1,23 +1,13 @@
-import type { Options } from '@storybook/core-common';
 import type { Plugin } from 'vite';
 import { createFilter } from 'vite';
 
 const isStorybookMdx = (id: string) => id.endsWith('stories.mdx') || id.endsWith('story.mdx');
 
-function injectRenderer(code: string, mdx2: boolean) {
+function injectRenderer(code: string) {
-  if (mdx2) {
+  return `
-    return `
            import React from 'react';
            ${code}
            `;
-  }
-
-  return `
-        /* @jsx mdx */
-        import React from 'react';
-        import { mdx } from '@mdx-js/react';
-        ${code}
-        `;
 }
 
 /**
@@ -28,9 +18,7 @@ function injectRenderer(code: string, mdx2: boolean) {
  *
  * @see https://github.com/storybookjs/storybook/blob/next/addons/docs/docs/recipes.md#csf-stories-with-arbitrary-mdx
  */
-export function mdxPlugin(options: Options): Plugin {
+export function mdxPlugin(): Plugin {
-  const { features } = options;
-
   let reactRefresh: Plugin | undefined;
   const include = /\.mdx?$/;
   const filter = createFilter(include);
@@ -60,7 +48,7 @@ export function mdxPlugin(options: Options): Plugin {
 
       const mdxCode = String(await compile(src, { skipCsf: !isStorybookMdx(id) }));
 
-      const modifiedCode = injectRenderer(mdxCode, true);
+      const modifiedCode = injectRenderer(mdxCode);
 
       // Hooks in recent rollup versions can be functions or objects, and though react hasn't changed, the typescript defs have
       const rTransform = reactRefresh?.transform;

code/lib/builder-vite/src/vite-config.ts

@@ -79,7 +79,7 @@ export async function pluginConfig(options: ExtendedOptions) {
   const plugins = [
     codeGeneratorPlugin(options),
     // sourceLoaderPlugin(options),
-    mdxPlugin(options),
+    mdxPlugin(),
     injectExportOrderPlugin,
     stripStoryHMRBoundary(),
     {