withastro/astro · warning
More than one JSX renderer is enabled. This will lead to une
Error message
More than one JSX renderer is enabled. This will lead to unexpected behavior unless you set the `include` or `exclude` option. See https://docs.astro.build/en/guides/integrations-guide/preact/#combining-multiple-jsx-frameworks for more information.
What it means
During astro:config:done the Preact integration checks config.integrations for other known JSX renderer integrations (@astrojs/react, @astrojs/preact, @astrojs/solid-js). If two or more are present and neither the include nor the exclude option was passed to the Preact integration, Vite cannot decide which JSX transform to apply per file, so this warning fires: JSX behavior will be inconsistent or wrong for one of the frameworks.
Source
Thrown at packages/integrations/preact/src/index.ts:110
];
addRenderer(getRenderer(command === 'dev'));
updateConfig({
vite: viteConfig,
});
if (command === 'dev' && devtools) {
injectScript('page', 'import "preact/debug";');
}
},
'astro:config:done': ({ logger, config }) => {
const knownJsxRenderers = ['@astrojs/react', '@astrojs/preact', '@astrojs/solid-js'];
const enabledKnownJsxRenderers = config.integrations.filter((renderer) =>
knownJsxRenderers.includes(renderer.name),
);
if (enabledKnownJsxRenderers.length > 1 && !include && !exclude) {
logger.warn(
'More than one JSX renderer is enabled. This will lead to unexpected behavior unless you set the `include` or `exclude` option. See https://docs.astro.build/en/guides/integrations-guide/preact/#combining-multiple-jsx-frameworks for more information.',
);
}
},
},
};
}
function configEnvironmentPlugin(compat: boolean | undefined): Plugin {
return {
name: '@astrojs/preact:environment',
configEnvironment(environmentName, options) {
const environmentOptions: EnvironmentOptions = {
optimizeDeps: {},
resolve: {},
};
if (environmentName === 'client') {View on GitHub (pinned to 52e6c34790)
Solutions
- Scope each JSX integration to its file globs: preact({ include: ['**/preact/**'] }) and react({ include: ['**/react/**'] }) (or exclude the other framework's directories).
- If only one framework is actually used, remove the unused renderer integration from config.
- Restart the dev server (config hooks run at startup) and confirm the warning is gone.
- See the linked docs section 'Combining multiple JSX frameworks' for the recommended glob layout.
Example fix
// before
export default defineConfig({
integrations: [preact(), react()],
});
// after
export default defineConfig({
integrations: [
preact({ include: ['**/preact/**'], exclude: ['**/react/**'] }),
react({ include: ['**/react/**'], exclude: ['**/preact/**'] }),
],
}); Defensive patterns
Strategy: validation
Validate before calling
const jsxIntegrations = ['@astrojs/react', '@astrojs/preact', '@astrojs/solid-js'];
const enabled = config.integrations.filter((i) => jsxIntegrations.includes(i.name));
if (enabled.length > 1 && !(preactOptions.include || preactOptions.exclude)) {
throw new Error('Multiple JSX renderers require include/exclude scopes on preact()');
} Prevention
- Whenever two JSX frameworks coexist, pass disjoint include/exclude globs to each integration.
- Organize components in per-framework directories (src/react/**, src/preact/**) so scoping is trivial.
- Remove unused renderer integrations from config after migrations finish.
When it happens
Trigger: astro.config.mjs registers both preact() and react() (or solid()) as integrations, and the preact() call has no include/exclude option. The astro:config:done hook counts 2+ known JSX renderers and logs the warning.
Common situations: Incrementally migrating a React site to Preact (both adapters installed temporarily); design systems mixing React components into a Preact app; examples/demos that install several renderer integrations at once.
Related errors
- More than one JSX renderer is enabled. This will lead to une
- More than one JSX renderer is enabled. This will lead to une
- More than one JSX renderer is enabled. This will lead to une
- Apps must be an object with an id, a name and an entrypoint.
- Auto-generating collections for folders in "src/content/" t
AI-assisted analysis of withastro/astro@52e6c34790 (2026-08-18).
Data as JSON: /api/errors/3f6fca7e2ccfa292.
Report an issue: GitHub.