Fixes local image resolution in SSR builds on Windows (#4173)

* fixing SSR local file resolution path on windows

* chore: add changeset

* nit: fixing typo in image README file

Co-authored-by: Nate Moore <natemoo-re@users.noreply.github.com>

.changeset/long-bees-promise.md

@@ -0,0 +1,5 @@
+---
+'@astrojs/image': patch
+---
+
+Fixes a bug related to local image files in SSR builds on Windows

packages/integrations/image/README.md

@@ -216,17 +216,15 @@ The list of sizes that should be built for responsive images. This is combined w
 <p>
 
 **Type:** `number` | `string`<br>
-**Required:** `true`
+**Default:** `undefined`
 </p>
 
-The desired aspect ratio of the output image. This is combined with `widhts` to calculate the final dimensions of each built image.
+The desired aspect ratio of the output image. This is combined with `widths` to calculate the final dimensions of each built image.
 
 A `string` can be provided in the form of `{width}:{height}`, ex: `16:9` or `3:4`.
 
 A `number` can also be provided, useful when the aspect ratio is calculated at build time. This can be an inline number such as `1.777` or inlined as a JSX expression like `aspectRatio={16/9}`.
 
-#### formats
-
 <p>
 
 **Type:** `Array<'avif' | 'jpeg' | 'png' | 'webp'>`<br>

packages/integrations/image/src/build/ssr.ts

@@ -6,8 +6,8 @@ import { ensureDir } from '../utils/paths.js';
 
 async function globImages(dir: URL) {
 	const srcPath = fileURLToPath(dir);
-	return await glob(`${srcPath}/**/*.{heic,heif,avif,jpeg,jpg,png,tiff,webp,gif}`, {
-		absolute: true,
+	return await glob('./**/*.{heic,heif,avif,jpeg,jpg,png,tiff,webp,gif}', {
+		cwd: fileURLToPath(dir)
 	});
 }
 
@@ -19,10 +19,11 @@ export interface SSRBuildParams {
 export async function ssrBuild({ srcDir, outDir }: SSRBuildParams) {
 	const images = await globImages(srcDir);
 
-	for await (const image of images) {
-		const to = image.replace(fileURLToPath(srcDir), fileURLToPath(outDir));
+	for (const image of images) {
+		const from = path.join(fileURLToPath(srcDir), image);
+		const to = path.join(fileURLToPath(outDir), image);
 
 		await ensureDir(path.dirname(to));
-		await fs.copyFile(image, to);
+		await fs.copyFile(from, to);
 	}
 }

packages/integrations/image/src/endpoints/prod.ts

@@ -21,7 +21,7 @@ export const get: APIRoute = async ({ request }) => {
 		} else {
 			const clientRoot = new URL('../client/', import.meta.url);
 			const localPath = new URL('.' + transform.src, clientRoot);
-			inputBuffer = await loadLocalImage(localPath.pathname);
+			inputBuffer = await loadLocalImage(localPath);
 		}
 
 		if (!inputBuffer) {

packages/integrations/image/src/utils/images.ts

@@ -13,7 +13,7 @@ export function isRemoteImage(src: string) {
 	return /^http(s?):\/\//.test(src);
 }
 
-export async function loadLocalImage(src: string) {
+export async function loadLocalImage(src: string | URL) {
 	try {
 		return await fs.readFile(src);
 	} catch {