Add preact/compat support to @astrojs/preact

packages/integrations/preact/src/index.ts

@@ -1,6 +1,6 @@
-import { AstroIntegration } from 'astro';
+import { AstroIntegration, AstroRenderer, ViteUserConfig } from 'astro';
 
-function getRenderer() {
+function getRenderer(): AstroRenderer {
 	return {
 		name: '@astrojs/preact',
 		clientEntrypoint: '@astrojs/preact/client.js',
@@ -18,8 +18,26 @@ function getRenderer() {
 	};
 }
 
-function getViteConfiguration() {
+function getCompatRenderer(): AstroRenderer {
 	return {
+		name: '@astrojs/preact/compat',
+		clientEntrypoint: '@astrojs/preact/client.js',
+		serverEntrypoint: '@astrojs/preact/server.js',
+		jsxImportSource: 'react',
+		jsxTransformOptions: async () => {
+			const {
+				default: { default: jsx },
+				// @ts-expect-error types not found
+			} = await import('@babel/plugin-transform-react-jsx');
+			return {
+				plugins: [jsx({}, { runtime: 'automatic', importSource: 'preact/compat' })],
+			};
+		},
+	};
+}
+
+function getViteConfiguration(compat?: boolean): ViteUserConfig {
+	const viteConfig: ViteUserConfig = {
 		optimizeDeps: {
 			include: [
 				'@astrojs/preact/client.js',
@@ -33,16 +51,30 @@ function getViteConfiguration() {
 			external: ['preact-render-to-string'],
 		},
 	};
+
+	if (compat) {
+    viteConfig.optimizeDeps!.include!.push('preact/compat');
+    viteConfig.resolve = {
+      alias: {
+        react: 'preact/compat',
+        'react-dom': 'preact/compat',
+      },
+      dedupe: ['react', 'react-dom'],
+    };
+  }
+
+	return viteConfig
 }
 
-export default function (): AstroIntegration {
+export default function ({ compat }: { compat?: boolean } = {}): AstroIntegration {
 	return {
 		name: '@astrojs/preact',
 		hooks: {
 			'astro:config:setup': ({ addRenderer, updateConfig }) => {
 				addRenderer(getRenderer());
+				if (compat) addRenderer(getCompatRenderer());
 				updateConfig({
-					vite: getViteConfiguration(),
+					vite: getViteConfiguration(compat),
 				});
 			},
 		},