{"record":{"id":"33b46107e0ec2003","repo":"remix-run/react-router","slug":"the-mdx-js-rollup-plugin-should-be-placed-befor","errorCode":null,"errorMessage":"The \"@mdx-js/rollup\" plugin should be placed before the React Router plugin in your Vite config","messagePattern":"The \"@mdx-js/rollup\" plugin should be placed before the React Router plugin in your Vite config","errorType":"validation","errorClass":null,"httpStatus":null,"severity":"error","filePath":"packages/react-router-dev/vite/plugins/validate-plugin-order.ts","lineNumber":32,"sourceCode":"      let reactRouterRscPluginIndex = pluginIndex(\"react-router/rsc\");\n      let viteRscPluginIndex = pluginIndex(\"rsc\");\n      if (\n        reactRouterRscPluginIndex >= 0 &&\n        viteRscPluginIndex >= 0 &&\n        reactRouterRscPluginIndex > viteRscPluginIndex\n      ) {\n        throw new Error(\n          `The \"@vitejs/plugin-rsc\" plugin should be placed after the React Router RSC plugin in your Vite config`,\n        );\n      }\n\n      let reactRouterPluginIndex = pluginIndex([\n        \"react-router\",\n        \"react-router/rsc\",\n      ]);\n      let mdxPluginIndex = pluginIndex(\"@mdx-js/rollup\");\n      if (mdxPluginIndex >= 0 && mdxPluginIndex > reactRouterPluginIndex) {\n        throw new Error(\n          `The \"@mdx-js/rollup\" plugin should be placed before the React Router plugin in your Vite config`,\n        );\n      }\n    },\n  };\n}\n","sourceCodeStart":14,"sourceCodeEnd":39,"githubUrl":"https://github.com/remix-run/react-router/blob/6beaca39526d5716c3c112ebb0782765baa5a9ce/packages/react-router-dev/vite/plugins/validate-plugin-order.ts#L14-L39","documentation":"React Router's Vite plugin registers a config hook that validates plugin ordering. The '@mdx-js/rollup' plugin must appear BEFORE the React Router plugin in the Vite 'plugins' array so that MDX route modules are compiled to plain JS before React Router applies its own route-module transforms. The check compares the index of '@mdx-js/rollup' against the index of the react-router plugin and throws when MDX comes later, because the React Router transforms would otherwise run on uncompiled .mdx files.","triggerScenarios":"A vite.config.ts whose plugins array is ordered as [reactRouter(), mdx()], i.e. mdxPluginIndex >= 0 and mdxPluginIndex > reactRouterPluginIndex (where the React Router index matches plugin names 'react-router' or 'react-router/rsc').","commonSituations":"Adding MDX support to a Framework Mode app by appending mdx() at the end of the plugins array; copying a Vite config from an MDX tutorial that places mdx() last; converting a plain Vite+MDX site to React Router and keeping the old plugin order.","solutions":["Move mdx() above reactRouter() in the vite.config.ts plugins array","Re-run 'react-router dev' or 'react-router build' to confirm the config hook passes","Check for duplicated plugin registrations (e.g. mdx() added twice in different spots) if the error persists"],"exampleFix":"// before (vite.config.ts)\nimport { reactRouter } from \"@react-router/dev/vite\";\nimport mdx from \"@mdx-js/rollup\";\nexport default defineConfig({\n  plugins: [reactRouter(), mdx()],\n});\n\n// after\nexport default defineConfig({\n  plugins: [mdx(), reactRouter()],\n});","handlingStrategy":"validation","validationCode":"// run before vite boots (e.g. in a prebuild script)\nimport { resolveConfig } from \"vite\";\nconst cfg = await resolveConfig({ configFile: \"vite.config.ts\" }, \"serve\");\nconst names = cfg.plugins.map((p) => p.name);\nconst mdx = names.indexOf(\"@mdx-js/rollup\");\nconst rr = names.findIndex((n) => n.startsWith(\"react-router\"));\nif (mdx !== -1 && rr !== -1 && mdx > rr) {\n  throw new Error(\"Move @mdx-js/rollup before the React Router plugin\");\n}","typeGuard":null,"tryCatchPattern":null,"preventionTips":["Order plugins that compile source (mdx, mdsvx, legacy) above framework plugins","Add a lint/CI step that asserts plugin order in vite.config.ts","When adding new Vite plugins, insert them relative to reactRouter(), not at the array end"],"tags":["vite","plugin-order","mdx","build-config","framework-mode"],"backgroundTag":"vite-plugin-order","analyzedSha":"6beaca39526d5716c3c112ebb0782765baa5a9ce","analyzedAt":"2026-08-18T18:04:14.938Z","contentChangedAt":"2026-08-18T18:04:14.938Z","schemaVersion":2},"datasetVersion":"2026-09-23T08:17:48.524Z"}