Merge branch 'main' into feat/style-types

.changeset/five-doors-love.md

@@ -0,0 +1,5 @@
+---
+'astro': minor
+---
+
+Adds support for using AVIF (`.avif`) files with the Image component. Importing an AVIF file will now correctly return the same object shape as other image file types. See the [Image docs](https://docs.astro.build/en/guides/images/#update-existing-img-tags) for more information on the different properties available on the returned object.

.changeset/grumpy-seas-learn.md

@@ -0,0 +1,5 @@
+---
+'@astrojs/markdown-remark': minor
+---
+
+feat(markdown): Add support for `imageReference` paths when collecting images

.changeset/slow-mirrors-provide.md

@@ -0,0 +1,5 @@
+---
+'astro': patch
+---
+
+Improved error messages around `astro:assets`

.changeset/ten-kings-smash.md

@@ -0,0 +1,5 @@
+---
+'create-astro': minor
+---
+
+Improve startup performance by removing dependencies, lazily initializing async contextual values

benchmark/packages/timer/tsconfig.json

@@ -2,9 +2,6 @@
   "extends": "../../../tsconfig.base.json",
   "include": ["src"],
   "compilerOptions": {
-    "allowJs": true,
-    "module": "ES2022",
-    "outDir": "./dist",
-    "target": "ES2022"
+    "outDir": "./dist"
   }
 }

packages/astro-prism/tsconfig.json

@@ -2,9 +2,6 @@
   "extends": "../../tsconfig.base.json",
   "include": ["src"],
   "compilerOptions": {
-    "allowJs": true,
-    "target": "ES2022",
-    "module": "ES2022",
     "outDir": "./dist"
   }
 }

packages/astro-rss/src/util.ts

@@ -1,5 +1,5 @@
 import type { z } from 'astro/zod';
-import type { RSSOptions } from './index';
+import type { RSSOptions } from './index.js';
 
 /** Normalize URL to its canonical form */
 export function createCanonicalURL(

packages/astro-rss/tsconfig.json

@@ -2,10 +2,6 @@
   "extends": "../../tsconfig.base.json",
   "include": ["src"],
   "compilerOptions": {
-    "allowJs": true,
-    "module": "ES2022",
-    "outDir": "./dist",
-    "target": "ES2022",
-    "strictNullChecks": true
+    "outDir": "./dist"
   }
 }

packages/astro/client.d.ts

@@ -52,7 +52,7 @@ declare module 'astro:assets' {
 				| import('./dist/assets/types.js').ImageTransform
 				| import('./dist/assets/types.js').UnresolvedImageTransform
 		) => Promise<import('./dist/assets/types.js').GetImageResult>;
-		imageConfig: import('./dist/@types/astro').AstroConfig['image'];
+		imageConfig: import('./dist/@types/astro.js').AstroConfig['image'];
 		getConfiguredImageService: typeof import('./dist/assets/index.js').getConfiguredImageService;
 		Image: typeof import('./components/Image.astro').default;
 	};
@@ -108,6 +108,10 @@ declare module '*.svg' {
 	const metadata: ImageMetadata;
 	export default metadata;
 }
+declare module '*.avif' {
+	const metadata: ImageMetadata;
+	export default metadata;
+}
 
 declare module 'astro:transitions' {
 	type TransitionModule = typeof import('./dist/transitions/index.js');
@@ -126,7 +130,7 @@ declare module 'astro:components' {
 	export * from 'astro/components';
 }
 
-type MD = import('./dist/@types/astro').MarkdownInstance<Record<string, any>>;
+type MD = import('./dist/@types/astro.js').MarkdownInstance<Record<string, any>>;
 interface ExportedMarkdownModuleEntities {
 	frontmatter: MD['frontmatter'];
 	file: MD['file'];
@@ -231,7 +235,7 @@ declare module '*.mdown' {
 }
 
 declare module '*.mdx' {
-	type MDX = import('./dist/@types/astro').MDXInstance<Record<string, any>>;
+	type MDX = import('./dist/@types/astro.js').MDXInstance<Record<string, any>>;
 
 	export const frontmatter: MDX['frontmatter'];
 	export const file: MDX['file'];
@@ -244,7 +248,7 @@ declare module '*.mdx' {
 }
 
 declare module 'astro:ssr-manifest' {
-	export const manifest: import('./dist/@types/astro').SSRManifest;
+	export const manifest: import('./dist/@types/astro.js').SSRManifest;
 }
 
 // Everything below are Vite's types (apart from image types, which are in `client.d.ts`)

packages/astro/package.json

@@ -157,6 +157,7 @@
     "p-limit": "^4.0.0",
     "path-to-regexp": "^6.2.1",
     "preferred-pm": "^3.1.2",
+    "probe-image-size": "^7.2.3",
     "prompts": "^2.4.2",
     "rehype": "^12.0.1",
     "resolve": "^1.22.4",
@@ -197,6 +198,7 @@
     "@types/js-yaml": "^4.0.5",
     "@types/mime": "^3.0.1",
     "@types/mocha": "^10.0.1",
+    "@types/probe-image-size": "^7.2.0",
     "@types/prompts": "^2.4.4",
     "@types/resolve": "^1.20.2",
     "@types/send": "^0.17.1",

packages/astro/src/@types/astro.ts

@@ -13,16 +13,16 @@ import type { AddressInfo } from 'node:net';
 import type * as rollup from 'rollup';
 import type { TsConfigJson } from 'tsconfig-resolver';
 import type * as vite from 'vite';
-import type { RemotePattern } from '../assets/utils/remotePattern';
-import type { SerializedSSRManifest } from '../core/app/types';
-import type { PageBuildData } from '../core/build/types';
-import type { AstroConfigType } from '../core/config';
-import type { AstroTimer } from '../core/config/timer';
-import type { AstroCookies } from '../core/cookies';
+import type { RemotePattern } from '../assets/utils/remotePattern.js';
+import type { SerializedSSRManifest } from '../core/app/types.js';
+import type { PageBuildData } from '../core/build/types.js';
+import type { AstroConfigType } from '../core/config/index.js';
+import type { AstroTimer } from '../core/config/timer.js';
+import type { AstroCookies } from '../core/cookies/index.js';
 import type { ResponseWithEncoding } from '../core/endpoint/index.js';
-import type { AstroIntegrationLogger, Logger, LoggerLevel } from '../core/logger/core';
-import type { AstroComponentFactory, AstroComponentInstance } from '../runtime/server';
-import type { OmitIndexSignature, Simplify } from '../type-utils';
+import type { AstroIntegrationLogger, Logger, LoggerLevel } from '../core/logger/core.js';
+import type { AstroComponentFactory, AstroComponentInstance } from '../runtime/server/index.js';
+import type { OmitIndexSignature, Simplify } from '../type-utils.js';
 import type { SUPPORTED_MARKDOWN_FILE_EXTENSIONS } from './../core/constants.js';
 
 export { type AstroIntegrationLogger };
@@ -39,7 +39,7 @@ export type {
 	ExternalImageService,
 	ImageService,
 	LocalImageService,
-} from '../assets/services/service';
+} from '../assets/services/service.js';
 export type {
 	GetImageResult,
 	ImageInputFormat,
@@ -48,10 +48,10 @@ export type {
 	ImageQuality,
 	ImageQualityPreset,
 	ImageTransform,
-} from '../assets/types';
-export type { RemotePattern } from '../assets/utils/remotePattern';
-export type { SSRManifest } from '../core/app/types';
-export type { AstroCookies } from '../core/cookies';
+} from '../assets/types.js';
+export type { RemotePattern } from '../assets/utils/remotePattern.js';
+export type { SSRManifest } from '../core/app/types.js';
+export type { AstroCookies } from '../core/cookies/index.js';
 
 export interface AstroBuiltinProps {
 	'client:load'?: boolean;

packages/astro/src/assets/build/generate.ts

@@ -1,6 +1,6 @@
 import fs, { readFileSync } from 'node:fs';
 import { basename, join } from 'node:path/posix';
-import type { BuildPipeline } from '../../core/build/buildPipeline';
+import type { BuildPipeline } from '../../core/build/buildPipeline.js';
 import { prependForwardSlash } from '../../core/path.js';
 import { isServerLikeOutput } from '../../prerender/utils.js';
 import { getConfiguredImageService, isESMImportedImage } from '../internal.js';

packages/astro/src/assets/consts.ts

@@ -1,21 +1,14 @@
 export const VIRTUAL_MODULE_ID = 'astro:assets';
 export const VIRTUAL_SERVICE_ID = 'virtual:image-service';
 export const VALID_INPUT_FORMATS = [
-	// TODO: `image-size` does not support the following formats, so users can't import them.
-	// However, it would be immensely useful to add, for three reasons:
-	// - `heic` and `heif` are common formats, especially among Apple users.
-	// - AVIF is a common format on the web that's bound to become more and more common.
-	// - It's totally reasonable for an user's provided image service to want to support more image types.
-	//'heic',
-	//'heif',
-	//'avif',
 	'jpeg',
 	'jpg',
 	'png',
 	'tiff',
 	'webp',
 	'gif',
 	'svg',
+	'avif',
 ] as const;
 /**
  * Valid formats that our base services support.
@@ -29,5 +22,6 @@ export const VALID_SUPPORTED_FORMATS = [
 	'webp',
 	'gif',
 	'svg',
+	'avif',
 ] as const;
 export const VALID_OUTPUT_FORMATS = ['avif', 'png', 'webp', 'jpeg', 'jpg', 'svg'] as const;

packages/astro/src/assets/internal.ts

@@ -77,12 +77,12 @@ export async function getImage(
 
 	const service = await getConfiguredImageService();
 
-	// If the user inlined an import, something fairly common especially in MDX, await it for them
+	// If the user inlined an import, something fairly common especially in MDX, or passed a function that returns an Image, await it for them
 	const resolvedOptions: ImageTransform = {
 		...options,
 		src:
 			typeof options.src === 'object' && 'then' in options.src
-				? (await options.src).default
+				? (await options.src).default ?? (await options.src)
 				: options.src,
 	};
 

packages/astro/src/assets/services/service.ts

@@ -1,6 +1,6 @@
 import type { AstroConfig } from '../../@types/astro.js';
 import { AstroError, AstroErrorData } from '../../core/errors/index.js';
-import { joinPaths } from '../../core/path.js';
+import { isRemotePath, joinPaths } from '../../core/path.js';
 import { VALID_SUPPORTED_FORMATS } from '../consts.js';
 import { isESMImportedImage, isRemoteAllowed } from '../internal.js';
 import type { ImageOutputFormat, ImageTransform } from '../types.js';
@@ -126,13 +126,20 @@ export const baseService: Omit<LocalImageService, 'transform'> = {
 		if (!options.src || (typeof options.src !== 'string' && typeof options.src !== 'object')) {
 			throw new AstroError({
 				...AstroErrorData.ExpectedImage,
-				message: AstroErrorData.ExpectedImage.message(JSON.stringify(options.src)),
+				message: AstroErrorData.ExpectedImage.message(
+					JSON.stringify(options.src),
+					typeof options.src,
+					JSON.stringify(options, (_, v) => (v === undefined ? null : v))
+				),
 			});
 		}
 
 		if (!isESMImportedImage(options.src)) {
-			// User passed an `/@fs/` path instead of the full image.
-			if (options.src.startsWith('/@fs/')) {
+			// User passed an `/@fs/` path or a filesystem path instead of the full image.
+			if (
+				options.src.startsWith('/@fs/') ||
+				(!isRemotePath(options.src) && !options.src.startsWith('/'))
+			) {
 				throw new AstroError({
 					...AstroErrorData.LocalImageUsedWrongly,
 					message: AstroErrorData.LocalImageUsedWrongly.message(options.src),

packages/astro/src/assets/services/vendor/squoosh/codecs.ts

@@ -33,23 +33,23 @@ export interface RotateOptions {
 }
 
 // MozJPEG
-import type { MozJPEGModule as MozJPEGEncodeModule } from './mozjpeg/mozjpeg_enc'
+import type { MozJPEGModule as MozJPEGEncodeModule } from './mozjpeg/mozjpeg_enc.js'
 import mozDec from './mozjpeg/mozjpeg_node_dec.js'
 import mozDecWasm from './mozjpeg/mozjpeg_node_dec.wasm.js'
 
 import mozEnc from './mozjpeg/mozjpeg_node_enc.js'
 import mozEncWasm from './mozjpeg/mozjpeg_node_enc.wasm.js'
 
 // WebP
-import type { WebPModule as WebPEncodeModule } from './webp/webp_enc'
+import type { WebPModule as WebPEncodeModule } from './webp/webp_enc.js'
 import webpDec from './webp/webp_node_dec.js'
 import webpDecWasm from './webp/webp_node_dec.wasm.js'
 
 import webpEnc from './webp/webp_node_enc.js'
 import webpEncWasm from './webp/webp_node_enc.wasm.js'
 
 // AVIF
-import type { AVIFModule as AVIFEncodeModule } from './avif/avif_enc'
+import type { AVIFModule as AVIFEncodeModule } from './avif/avif_enc.js'
 import avifDec from './avif/avif_node_dec.js'
 import avifDecWasm from './avif/avif_node_dec.wasm.js'
 

packages/astro/src/assets/utils/metadata.ts

@@ -1,8 +1,13 @@
+import probe from 'probe-image-size';
 import type { ImageInputFormat, ImageMetadata } from '../types.js';
-import imageSize from '../vendor/image-size/index.js';
 
 export async function imageMetadata(data: Buffer): Promise<Omit<ImageMetadata, 'src'> | undefined> {
-	const { width, height, type, orientation } = imageSize(data);
+	const result = probe.sync(data);
+	if (result === null) {
+		throw new Error('Failed to probe image size.');
+	}
+
+	const { width, height, type, orientation } = result;
 	const isPortrait = (orientation || 0) >= 5;
 
 	if (!width || !height || !type) {