Fix build failure when using astro:config/client in a client script

.changeset/lucky-teams-play.md

@@ -0,0 +1,5 @@
+---
+'astro': patch
+---
+
+Fixes a build error where using `astro:config/client` inside a `<script>` tag would cause Rollup to fail with "failed to resolve import `virtual:astro:routes` from `virtual:astro:manifest`"

packages/astro/src/core/create-vite.ts

@@ -136,7 +136,7 @@ export async function createVite(
 			}),
 			vitePluginStaticPaths(),
 			await astroPluginRoutes({ routesList, settings, logger, fsMod: fs, command }),
-			astroVirtualManifestPlugin(),
+			astroVirtualManifestPlugin({ settings }),
 			vitePluginEnvironment({ settings, astroPkgsConfig, command }),
 			pluginPage({ routesList }),
 			pluginPages({ routesList }),

packages/astro/src/manifest/serialized.ts

@@ -72,6 +72,16 @@ export function serializedManifestPlugin({
 			server.watcher.on('change', (path) => reloadManifest(path, server));
 		},
 
+		// Restrict to server environments only since the generated code imports
+		// server-only virtual modules (virtual:astro:routes, virtual:astro:pages)
+		applyToEnvironment(environment) {
+			return (
+				environment.name === ASTRO_VITE_ENVIRONMENT_NAMES.astro ||
+				environment.name === ASTRO_VITE_ENVIRONMENT_NAMES.ssr ||
+				environment.name === ASTRO_VITE_ENVIRONMENT_NAMES.prerender
+			);
+		},
+
 		resolveId: {
 			filter: {
 				id: new RegExp(`^${SERIALIZED_MANIFEST_ID}$`),

packages/astro/src/manifest/virtual-module.ts

@@ -2,13 +2,59 @@ import type { Plugin } from 'vite';
 import { AstroError, AstroErrorData } from '../core/errors/index.js';
 import { SERIALIZED_MANIFEST_ID } from './serialized.js';
 import { ASTRO_VITE_ENVIRONMENT_NAMES } from '../core/constants.js';
+import { fromRoutingStrategy, toFallbackType, toRoutingStrategy } from '../core/app/common.js';
+import type { AstroSettings } from '../types/astro.js';
 
 const VIRTUAL_SERVER_ID = 'astro:config/server';
 const RESOLVED_VIRTUAL_SERVER_ID = '\0' + VIRTUAL_SERVER_ID;
 const VIRTUAL_CLIENT_ID = 'astro:config/client';
 const RESOLVED_VIRTUAL_CLIENT_ID = '\0' + VIRTUAL_CLIENT_ID;
 
-export default function virtualModulePlugin(): Plugin {
+export default function virtualModulePlugin({ settings }: { settings: AstroSettings }): Plugin {
+	// Pre-compute the client config values from settings so that astro:config/client
+	// doesn't need to import from virtual:astro:manifest (which pulls in server-only
+	// virtual modules like virtual:astro:routes and virtual:astro:pages that are
+	// restricted to server environments via applyToEnvironment).
+	const config = settings.config;
+
+	let i18nCode = 'const i18n = undefined;';
+	if (config.i18n) {
+		// Apply the same toRoutingStrategy → fromRoutingStrategy roundtrip that the
+		// serialized manifest uses, to ensure consistent routing config values.
+		const strategy = toRoutingStrategy(config.i18n.routing, config.i18n.domains);
+		const fallbackType = toFallbackType(config.i18n.routing);
+		const routing = fromRoutingStrategy(strategy, fallbackType);
+		i18nCode = `const i18n = {
+  defaultLocale: ${JSON.stringify(config.i18n.defaultLocale)},
+  locales: ${JSON.stringify(config.i18n.locales)},
+  routing: ${JSON.stringify(routing)},
+  fallback: ${JSON.stringify(config.i18n.fallback)}
+};`;
+	}
+
+	let imageCode = 'const image = undefined;';
+	if (config.image) {
+		imageCode = `const image = {
+  objectFit: ${JSON.stringify(config.image.objectFit)},
+  objectPosition: ${JSON.stringify(config.image.objectPosition)},
+  layout: ${JSON.stringify(config.image.layout)},
+};`;
+	}
+
+	const clientConfigCode = `
+${i18nCode}
+${imageCode}
+const base = ${JSON.stringify(config.base)};
+const trailingSlash = ${JSON.stringify(config.trailingSlash)};
+const site = ${JSON.stringify(config.site)};
+const compressHTML = ${JSON.stringify(config.compressHTML)};
+const build = {
+  format: ${JSON.stringify(config.build.format)},
+};
+
+export { base, i18n, trailingSlash, site, compressHTML, build, image };
+`;
+
 	return {
 		name: 'astro-manifest-plugin',
 		resolveId: {
@@ -30,41 +76,11 @@ export default function virtualModulePlugin(): Plugin {
 			},
 			handler(id) {
 				if (id === RESOLVED_VIRTUAL_CLIENT_ID) {
-					// There's nothing wrong about using `/client` on the server
-					const code = `
-import { manifest } from '${SERIALIZED_MANIFEST_ID}'
-import { fromRoutingStrategy } from 'astro/app';
-
-let i18n = undefined;
-if (manifest.i18n) {
-i18n = {
-  defaultLocale: manifest.i18n.defaultLocale,
-  locales: manifest.i18n.locales,
-  routing: fromRoutingStrategy(manifest.i18n.strategy, manifest.i18n.fallbackType),
-  fallback: manifest.i18n.fallback
-  };
-}
-
-let image = undefined;
-if (manifest.image) {
-  image = {
-    objectFit: manifest.image.objectFit,
-    objectPosition: manifest.image.objectPosition,
-    layout: manifest.image.layout,
-  };
-}
-
-const base = manifest.base;
-const trailingSlash = manifest.trailingSlash;
-const site = manifest.site;
-const compressHTML = manifest.compressHTML;
-const build = {
-  format: manifest.buildFormat,
-};
-
-export { base, i18n, trailingSlash, site, compressHTML, build, image };
-				`;
-					return { code };
+					// astro:config/client inlines values directly from settings instead of
+					// importing from virtual:astro:manifest to avoid pulling server-only
+					// virtual modules (virtual:astro:routes, virtual:astro:pages) into the
+					// client environment where they are not available.
+					return { code: clientConfigCode };
 				}
 				if (id === RESOLVED_VIRTUAL_SERVER_ID) {
 					if (this.environment.name === ASTRO_VITE_ENVIRONMENT_NAMES.client) {

packages/astro/test/fixtures/astro-manifest-client-script/astro.config.mjs

@@ -0,0 +1,6 @@
+import { defineConfig } from "astro/config";
+
+// https://astro.build/config
+export default defineConfig({
+	site: "https://example.com",
+});

packages/astro/test/fixtures/astro-manifest-client-script/package.json

@@ -0,0 +1,8 @@
+{
+  "name": "@test/astro-manifest-client-script",
+  "version": "0.0.0",
+  "private": true,
+  "dependencies": {
+    "astro": "workspace:*"
+  }
+}

packages/astro/test/fixtures/astro-manifest-client-script/src/pages/index.astro

@@ -0,0 +1,18 @@
+---
+---
+<!DOCTYPE html>
+<html lang="en">
+<head>
+	<meta charset="UTF-8"/>
+	<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
+	<title>Document</title>
+</head>
+<body>
+	<h1>Hello, World!</h1>
+	<p id="base"></p>
+	<script>
+		import { base } from "astro:config/client";
+		document.getElementById('base').textContent = base;
+	</script>
+</body>
+</html>

packages/astro/test/serializeManifest.test.js

@@ -89,6 +89,26 @@ describe('astro:config/client', () => {
 	});
 });
 
+describe('astro:config/client in a client script', () => {
+	/** @type {import('./test-utils').Fixture} */
+	let fixture;
+
+	describe('when build', () => {
+		before(async () => {
+			fixture = await loadFixture({
+				root: './fixtures/astro-manifest-client-script/',
+				adapter: testAdapter(),
+				output: 'server',
+			});
+		});
+
+		it('should build without errors when astro:config/client is used in a client script', async () => {
+			const error = await fixture.build().catch((err) => err);
+			assert.equal(error, undefined, `Build failed with: ${error?.message}`);
+		});
+	});
+});
+
 describe('astro:config/server', () => {
 	/** @type {import('./test-utils').Fixture} */
 	let fixture;