Merge pull request #8188 from withastro/next

Astro 3.0

2 files changed, 51 insertions, 79 deletions

diff --git a/packages/integrations/preact/src/index.ts b/packages/integrations/preact/src/index.ts
index 98a2dd205..9551f97eb 100644
--- a/packages/integrations/preact/src/index.ts
+++ b/packages/integrations/preact/src/index.ts
@@ -1,94 +1,66 @@
 import type { AstroIntegration, AstroRenderer, ViteUserConfig } from 'astro';
+import preact, { type PreactPluginOptions as VitePreactPluginOptions } from '@preact/preset-vite';
+import { fileURLToPath } from 'node:url';
+
+const babelCwd = new URL('../', import.meta.url);
 
 function getRenderer(development: boolean): AstroRenderer {
 	return {
 		name: '@astrojs/preact',
 		clientEntrypoint: development ? '@astrojs/preact/client-dev.js' : '@astrojs/preact/client.js',
 		serverEntrypoint: '@astrojs/preact/server.js',
-		jsxImportSource: 'preact',
-		jsxTransformOptions: async () => {
-			// @ts-expect-error types not found
-			const plugin = await import('@babel/plugin-transform-react-jsx');
-			const jsx = plugin.default?.default ?? plugin.default;
-			return {
-				plugins: [jsx({}, { runtime: 'automatic', importSource: 'preact' })],
-			};
-		},
 	};
 }
 
-function getCompatRenderer(development: boolean): AstroRenderer {
+export type Options = Pick<VitePreactPluginOptions, 'include' | 'exclude'> & { compat?: boolean };
+
+export default function ({ include, exclude, compat }: Options = {}): AstroIntegration {
 	return {
 		name: '@astrojs/preact',
-		clientEntrypoint: development ? '@astrojs/preact/client-dev.js' : '@astrojs/preact/client.js',
-		serverEntrypoint: '@astrojs/preact/server.js',
-		jsxImportSource: 'react',
-		jsxTransformOptions: async () => {
-			// @ts-expect-error types not found
-			const plugin = await import('@babel/plugin-transform-react-jsx');
-			const jsx = plugin.default?.default ?? plugin.default;
-			return {
-				plugins: [
-					jsx({}, { runtime: 'automatic', importSource: 'preact/compat' }),
-					[
-						'babel-plugin-module-resolver',
-						{
-							alias: {
-								react: 'preact/compat',
-								'react-dom/test-utils': 'preact/test-utils',
-								'react-dom': 'preact/compat',
-								'react/jsx-runtime': 'preact/jsx-runtime',
-							},
-						},
-					],
-				],
-			};
-		},
-	};
-}
+		hooks: {
+			'astro:config:setup': ({ addRenderer, updateConfig, command }) => {
+				const preactPlugin = preact({
+					include,
+					exclude,
+					babel: {
+						cwd: fileURLToPath(babelCwd),
+					},
+				});
 
-function getViteConfiguration(compat?: boolean): ViteUserConfig {
-	const viteConfig: ViteUserConfig = {
-		optimizeDeps: {
-			include: ['@astrojs/preact/client.js', 'preact', 'preact/jsx-runtime'],
-			exclude: ['@astrojs/preact/server.js'],
-		},
-	};
+				const viteConfig: ViteUserConfig = {
+					optimizeDeps: {
+						include: ['@astrojs/preact/client.js', 'preact', 'preact/jsx-runtime'],
+						exclude: ['@astrojs/preact/server.js'],
+					},
+				};
 
-	if (compat) {
-		viteConfig.optimizeDeps!.include!.push(
-			'preact/compat',
-			'preact/test-utils',
-			'preact/compat/jsx-runtime'
-		);
-		viteConfig.resolve = {
-			alias: [
-				{ find: 'react', replacement: 'preact/compat' },
-				{ find: 'react-dom/test-utils', replacement: 'preact/test-utils' },
-				{ find: 'react-dom', replacement: 'preact/compat' },
-				{ find: 'react/jsx-runtime', replacement: 'preact/jsx-runtime' },
-			],
-			dedupe: ['preact/compat', 'preact'],
-		};
-		// noExternal React entrypoints to be bundled, resolved, and aliased by Vite
-		viteConfig.ssr = {
-			noExternal: ['react', 'react-dom', 'react-dom/test-utils', 'react/jsx-runtime'],
-		};
-	}
+				// If not compat, delete the plugin that does it
+				if (!compat) {
+					const pIndex = preactPlugin.findIndex((p) => p.name == 'preact:config');
+					if (pIndex >= 0) {
+						preactPlugin.splice(pIndex, 1);
+					}
+				} else {
+					viteConfig.optimizeDeps!.include!.push(
+						'preact/compat',
+						'preact/test-utils',
+						'preact/compat/jsx-runtime'
+					);
+					viteConfig.resolve = {
+						alias: [{ find: 'react/jsx-runtime', replacement: 'preact/jsx-runtime' }],
+						dedupe: ['preact/compat', 'preact'],
+					};
+					// noExternal React entrypoints to be bundled, resolved, and aliased by Vite
+					viteConfig.ssr = {
+						noExternal: ['react', 'react-dom', 'react-dom/test-utils', 'react/jsx-runtime'],
+					};
+				}
 
-	return viteConfig;
-}
+				viteConfig.plugins = [preactPlugin];
 
-export default function ({ compat }: { compat?: boolean } = {}): AstroIntegration {
-	return {
-		name: '@astrojs/preact',
-		hooks: {
-			'astro:config:setup': ({ addRenderer, updateConfig, command }) => {
-				const development = command === 'dev';
-				if (compat) addRenderer(getCompatRenderer(development));
-				addRenderer(getRenderer(development));
+				addRenderer(getRenderer(command === 'dev'));
 				updateConfig({
-					vite: getViteConfiguration(compat),
+					vite: viteConfig,
 				});
 			},
 		},
diff --git a/packages/integrations/preact/src/server.ts b/packages/integrations/preact/src/server.ts
index 6a2ceb612..e55d29d1c 100644
--- a/packages/integrations/preact/src/server.ts
+++ b/packages/integrations/preact/src/server.ts
@@ -1,5 +1,5 @@
 import type { AstroComponentMetadata } from 'astro';
-import { Component as BaseComponent, h } from 'preact';
+import { Component as BaseComponent, h, type VNode } from 'preact';
 import render from 'preact-render-to-string';
 import { getContext } from './context.js';
 import { restoreSignalsOnProps, serializeSignals } from './signals.js';
@@ -29,8 +29,8 @@ function check(this: RendererContext, Component: any, props: Record<string, any>
 
 			// There are edge cases (SolidJS) where Preact *might* render a string,
 			// but components would be <undefined></undefined>
-
-			return !/\<undefined\>/.test(html);
+			// It also might render an empty sting.
+			return html == '' ? false : !/\<undefined\>/.test(html);
 		} catch (err) {
 			return false;
 		}
@@ -60,7 +60,7 @@ function renderToStaticMarkup(
 			hydrate: shouldHydrate(metadata),
 			value,
 			name,
-		});
+		}) as VNode<any>;
 	}
 
 	// Restore signals back onto props so that they will be passed as-is to components
@@ -81,7 +81,7 @@ function renderToStaticMarkup(
 						value: children,
 				  })
 				: children
-		)
+		) as VNode<any>
 	);
 	return {
 		attrs,