Feat/environment api

.changeset/open-monkeys-boil.md

@@ -0,0 +1,7 @@
+---
+'@astrojs/cloudflare': major
+---
+
+Runs "astro dev" using Cloudflare Vite plugin. This means that dev runs in workerd, giving a dev experience much closer to production.
+
+TODO: add a lot more detail on what this means and what it breaks

.changeset/warm-things-allow.md

@@ -0,0 +1,7 @@
+---
+'astro': major
+---
+
+Implements Vite Environment API
+
+TODO: add more details

benchmark/packages/adapter/src/server.ts

@@ -1,8 +1,8 @@
 import * as fs from 'node:fs';
 import type { SSRManifest } from 'astro';
-import { App } from 'astro/app';
+import { AppPipeline, BaseApp } from 'astro/app';
 
-class MyApp extends App {
+class MyApp extends BaseApp {
 	#manifest: SSRManifest | undefined;
 	constructor(manifest: SSRManifest, streaming = false) {
 		super(manifest, streaming);
@@ -19,6 +19,14 @@ class MyApp extends App {
 
 		return super.render(request);
 	}
+
+	createPipeline(streaming: boolean) {
+		return AppPipeline.create({
+			logger: this.logger,
+			manifest: this.manifest,
+			streaming,
+		});
+	}
 }
 
 export function createExports(manifest: SSRManifest) {

knip.js

@@ -29,8 +29,15 @@ export default {
 				'test/types/**/*',
 				'e2e/**/*.test.js',
 				'test/units/teardown.js',
+				// Can't detect this file when using inside a vite plugin
+				'src/vite-plugin-app/createAstroServerApp.ts',
+			],
+			ignore: [
+				'**/e2e/**/{fixtures,_temp-fixtures}/**',
+				'performance/**/*',
+				// This export is resolved dynamically in packages/astro/src/vite-plugin-app/index.ts
+				'src/vite-plugin-app/createExports.ts',
 			],
-			ignore: ['**/e2e/**/{fixtures,_temp-fixtures}/**', 'performance/**/*'],
 			// Those deps are used in tests but only referenced as strings
 			ignoreDependencies: [
 				'rehype-autolink-headings',

packages/astro/dev-only.d.ts

@@ -18,3 +18,34 @@ declare module 'virtual:astro:actions/options' {
 declare module 'virtual:astro:actions/runtime' {
 	export * from './src/actions/runtime/client.js';
 }
+
+declare module 'virtual:astro:actions/entrypoint' {
+	import type { SSRActions } from './src/index.js';
+	export const server: SSRActions;
+}
+
+declare module 'virtual:astro:serialized-manifest' {
+	import type { SSRManifest } from './src/index.js';
+	export const manifest: SSRManifest;
+}
+
+declare module 'virtual:astro:routes' {
+	import type { RoutesList } from './src/types/astro.js';
+	export const routes: RoutesList[];
+}
+
+declare module 'virtual:astro:renderers' {
+	import type { AstroRenderer } from './src/index.js';
+	export const renderers: AstroRenderer[];
+}
+
+declare module 'virtual:astro:middleware' {
+	import type { AstroMiddlewareInstance } from './src/index.js';
+	const middleware: AstroMiddlewareInstance;
+	export default middleware;
+}
+
+declare module 'virtual:astro:session-driver' {
+	import type { Driver } from 'unstorage';
+	export const driver: Driver;
+}

packages/astro/package.json

@@ -47,6 +47,7 @@
     "./container": "./dist/container/index.js",
     "./app": "./dist/core/app/index.js",
     "./app/node": "./dist/core/app/node.js",
+    "./app/entrypoint": "./dist/core/app/entrypoint.js",
     "./client/*": "./dist/runtime/client/*",
     "./components": "./components/index.ts",
     "./components/*": "./components/*",
@@ -55,6 +56,7 @@
     "./assets": "./dist/assets/index.js",
     "./assets/runtime": "./dist/assets/runtime.js",
     "./assets/utils": "./dist/assets/utils/index.js",
+    "./assets/utils/node": "./dist/assets/utils/node.js",
     "./assets/utils/inferRemoteSize.js": "./dist/assets/utils/remoteProbe.js",
     "./assets/endpoint/*": "./dist/assets/endpoint/*.js",
     "./assets/services/sharp": "./dist/assets/services/sharp.js",

packages/astro/src/assets/endpoint/config.ts

@@ -48,7 +48,6 @@ function getImageEndpointData(
 		segments,
 		params: [],
 		component: resolveInjectedRoute(endpointEntrypoint, settings.config.root, cwd).component,
-		generate: () => '',
 		pathname: settings.config.image.endpoint.route,
 		prerender: false,
 		fallbackRoutes: [],

packages/astro/src/assets/fonts/implementations/remote-font-provider-mod-resolver.ts

@@ -1,4 +1,4 @@
-import type { ViteDevServer } from 'vite';
+import type { RunnableDevEnvironment } from 'vite';
 import type { RemoteFontProviderModResolver } from '../definitions.js';
 
 export function createBuildRemoteFontProviderModResolver(): RemoteFontProviderModResolver {
@@ -10,13 +10,13 @@ export function createBuildRemoteFontProviderModResolver(): RemoteFontProviderMo
 }
 
 export function createDevServerRemoteFontProviderModResolver({
-	server,
+	environment,
 }: {
-	server: ViteDevServer;
+	environment: RunnableDevEnvironment;
 }): RemoteFontProviderModResolver {
 	return {
 		resolve(id) {
-			return server.ssrLoadModule(id);
+			return environment.runner.import(id);
 		},
 	};
 }

packages/astro/src/assets/fonts/vite-plugin-fonts.ts

@@ -3,7 +3,7 @@ import { readFile } from 'node:fs/promises';
 import { isAbsolute } from 'node:path';
 import { fileURLToPath } from 'node:url';
 import { bold } from 'kleur/colors';
-import type { Plugin } from 'vite';
+import type { Plugin, RunnableDevEnvironment } from 'vite';
 import { getAlgorithm, shouldTrackCspHashes } from '../../core/csp/common.js';
 import { generateCspDigest } from '../../core/encryption.js';
 import { collectErrorMetadata } from '../../core/errors/dev/utils.js';
@@ -232,7 +232,9 @@ export function fontsPlugin({ settings, sync, logger }: Options): Plugin {
 			await initialize({
 				// In dev, we cache fonts data in .astro so it can be easily inspected and cleared
 				cacheDir: new URL(CACHE_DIR, settings.dotAstroDir),
-				modResolver: createDevServerRemoteFontProviderModResolver({ server }),
+				modResolver: createDevServerRemoteFontProviderModResolver({
+					environment: server.environments.astro as RunnableDevEnvironment,
+				}),
 				cssRenderer: createMinifiableCssRenderer({ minify: false }),
 				urlResolver: createDevUrlResolver({ base: baseUrl }),
 				createHashResolver: (dependencies) =>

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

@@ -7,7 +7,6 @@
 
 export { isESMImportedImage, isRemoteImage, resolveSrc } from './imageKind.js';
 export { imageMetadata } from './metadata.js';
-export { emitImageMetadata } from './node/emitAsset.js';
 export { getOrigQueryParams } from './queryParams.js';
 export {
 	isRemoteAllowed,
@@ -19,4 +18,3 @@ export {
 	type RemotePattern,
 } from './remotePattern.js';
 export { inferRemoteSize } from './remoteProbe.js';
-export { hashTransform, propsToFilename } from './transformToPath.js';

packages/astro/src/assets/utils/node/emitAsset.ts → packages/astro/src/assets/utils/node.ts

@@ -1,11 +1,14 @@
 import fs from 'node:fs/promises';
-import path from 'node:path';
+import path, { basename, dirname, extname } from 'node:path';
 import { fileURLToPath, pathToFileURL } from 'node:url';
+import { deterministicString } from 'deterministic-object-hash';
 import type * as vite from 'vite';
-import { generateContentHash } from '../../../core/encryption.js';
-import { prependForwardSlash, slash } from '../../../core/path.js';
-import type { ImageMetadata } from '../../types.js';
-import { imageMetadata } from '../metadata.js';
+import { generateContentHash } from '../../core/encryption.js';
+import { prependForwardSlash, removeQueryString, slash } from '../../core/path.js';
+import { shorthash } from '../../runtime/server/shorthash.js';
+import type { ImageMetadata, ImageTransform } from '../types.js';
+import { isESMImportedImage } from './imageKind.js';
+import { imageMetadata } from './metadata.js';
 
 type FileEmitter = vite.Rollup.EmitFile;
 type ImageMetadataWithContents = ImageMetadata & { contents?: Buffer };
@@ -139,3 +142,70 @@ function fileURLToNormalizedPath(filePath: URL): string {
 	// Uses `slash` instead of Vite's `normalizePath` to avoid CJS bundling issues.
 	return slash(fileURLToPath(filePath) + filePath.search).replace(/\\/g, '/');
 }
+
+// Taken from https://github.com/rollup/rollup/blob/a8647dac0fe46c86183be8596ef7de25bc5b4e4b/src/utils/sanitizeFileName.ts
+// eslint-disable-next-line no-control-regex
+const INVALID_CHAR_REGEX = /[\u0000-\u001F"#$%&*+,:;<=>?[\]^`{|}\u007F]/g;
+
+/**
+ * Converts a file path and transformation properties of the transformation image service, into a formatted filename.
+ *
+ * The formatted filename follows this structure:
+ *
+ * `<prefixDirname>/<baseFilename>_<hash><outputExtension>`
+ *
+ * - `prefixDirname`: If the image is an ESM imported image, this is the directory name of the original file path; otherwise, it will be an empty string.
+ * - `baseFilename`: The base name of the file or a hashed short name if the file is a `data:` URI.
+ * - `hash`: A unique hash string generated to distinguish the transformed file.
+ * - `outputExtension`: The desired output file extension derived from the `transform.format` or the original file extension.
+ *
+ * ## Example
+ * - Input: `filePath = '/images/photo.jpg'`, `transform = { format: 'png', src: '/images/photo.jpg' }`, `hash = 'abcd1234'`.
+ * - Output: `/images/photo_abcd1234.png`
+ *
+ * @param {string} filePath - The original file path or data URI of the source image.
+ * @param {ImageTransform} transform - An object representing the transformation properties, including format and source.
+ * @param {string} hash - A unique hash used to differentiate the transformed file.
+ * @return {string} The generated filename based on the provided input, transformations, and hash.
+ */
+
+export function propsToFilename(filePath: string, transform: ImageTransform, hash: string): string {
+	let filename = decodeURIComponent(removeQueryString(filePath));
+	const ext = extname(filename);
+	if (filePath.startsWith('data:')) {
+		filename = shorthash(filePath);
+	} else {
+		filename = basename(filename, ext).replace(INVALID_CHAR_REGEX, '_');
+	}
+	const prefixDirname = isESMImportedImage(transform.src) ? dirname(filePath) : '';
+
+	let outputExt = transform.format ? `.${transform.format}` : ext;
+	return `${prefixDirname}/${filename}_${hash}${outputExt}`;
+}
+
+/**
+ * Transforms the provided `transform` object into a hash string based on selected properties
+ * and the specified `imageService`.
+ *
+ * @param {ImageTransform} transform - The transform object containing various image transformation properties.
+ * @param {string} imageService - The name of the image service related to the transform.
+ * @param {string[]} propertiesToHash - An array of property names from the `transform` object that should be used to generate the hash.
+ * @return {string} A hashed string created from the specified properties of the `transform` object and the image service.
+ */
+export function hashTransform(
+	transform: ImageTransform,
+	imageService: string,
+	propertiesToHash: string[],
+): string {
+	// Extract the fields we want to hash
+	const hashFields = propertiesToHash.reduce(
+		(acc, prop) => {
+			// It's possible for `transform[prop]` here to be undefined, or null, but that's fine because it's still consistent
+			// between different transforms. (ex: every transform without a height will explicitly have a `height: undefined` property)
+			acc[prop] = transform[prop];
+			return acc;
+		},
+		{ imageService } as Record<string, unknown>,
+	);
+	return shorthash(deterministicString(hashFields));
+}

packages/astro/src/assets/vite-plugin-assets.ts

@@ -17,11 +17,10 @@ import { VALID_INPUT_FORMATS, VIRTUAL_MODULE_ID, VIRTUAL_SERVICE_ID } from './co
 import { fontsPlugin } from './fonts/vite-plugin-fonts.js';
 import type { ImageTransform } from './types.js';
 import { getAssetsPrefix } from './utils/getAssetsPrefix.js';
-import { isESMImportedImage } from './utils/imageKind.js';
-import { emitImageMetadata } from './utils/node/emitAsset.js';
+import { isESMImportedImage } from './utils/index.js';
+import { emitImageMetadata, hashTransform, propsToFilename } from './utils/node.js';
 import { getProxyCode } from './utils/proxy.js';
 import { makeSvgComponent } from './utils/svg.js';
-import { hashTransform, propsToFilename } from './utils/transformToPath.js';
 
 const resolvedVirtualModuleId = '\0' + VIRTUAL_MODULE_ID;
 

packages/astro/src/config/entrypoint.ts

@@ -1,6 +1,7 @@
 // IMPORTANT: this file is the entrypoint for "astro/config". Keep it as light as possible!
 
 import type { SharpImageServiceConfig } from '../assets/services/sharp.js';
+
 import type { ImageServiceConfig } from '../types/public/index.js';
 
 export { defineAstroFontProvider, fontProviders } from '../assets/fonts/providers/index.js';