✨ Major Changes
-
#11864
ee38b3aThanks @ematipico! - ### [changed]:entryPointtype inside the hookastro:build:ssrIn Astro v4.x, theentryPointtype wasRouteData.Astro v5.0 the
entryPointtype isIntegrationRouteData, which contains a subset of theRouteDatatype. The fieldsisIndexandfallbackRouteswere removed.What should I do?
Update your adapter to change the type of
entryPointfromRouteDatatoIntegrationRouteData.import type {RouteData} from 'astro';import type {IntegrationRouteData} from "astro"function useRoute(route: RouteData) {function useRoute(route: IntegrationRouteData) {} -
#11908
518433eThanks @Princesseuh! - Theimage.endpointconfig now allow customizing the route of the image endpoint in addition to the entrypoint. This can be useful in niche situations where the default route/_imageconflicts with an existing route or your local server setup.import { defineConfig } from 'astro/config';defineConfig({image: {endpoint: {route: '/image',entrypoint: './src/image_endpoint.ts',},},}); -
#11806
f7f2338Thanks @Princesseuh! - Removes theassetsproperty onsupportedAstroFeaturesfor adapters, as it did not reflect reality properly in many cases.Now, relating to assets, only a single
sharpImageServiceproperty is available, determining if the adapter is compatible with the built-in sharp image service. -
#11864
ee38b3aThanks @ematipico! - ### [changed]:routestype inside the hookastro:build:doneIn Astro v4.x, theroutestype wasRouteData.Astro v5.0 the
routestype isIntegrationRouteData, which contains a subset of theRouteDatatype. The fieldsisIndexandfallbackRouteswere removed.What should I do?
Update your adapter to change the type of
routesfromRouteDatatoIntegrationRouteData.import type {RouteData} from 'astro';import type {IntegrationRouteData} from "astro"function useRoute(route: RouteData) {function useRoute(route: IntegrationRouteData) {} -
#11864
ee38b3aThanks @ematipico! - ### [changed]:RouteData.distURLis now an array In Astro v4.x,RouteData.distURLwasundefinedor aURLAstro v5.0,
RouteData.distURLisundefinedor an array ofURL. This was a bug, because a route can generate multiple files on disk, especially when using dynamic routes such as[slug]or[...slug].What should I do?
Update your code to handle
RouteData.distURLas an array.if (route.distURL) {if (route.distURL.endsWith('index.html')) {// do something}for (const url of route.distURL) {if (url.endsWith('index.html')) {// do something}}}
🍿 Minor Changes
-
#11806
f7f2338Thanks @Princesseuh! - The value of the different properties onsupportedAstroFeaturesfor adapters can now be objects, with asupportandmessageproperties. The content of themessageproperty will be shown in the Astro CLI when the adapter is not compatible with the feature, allowing one to give a better informational message to the user.This is notably useful with the new
limitedvalue, to explain to the user why support is limited. -
#11955
d813262Thanks @matthewp! - Server Islands introduced behind an experimental flag in v4.12.0 is no longer experimental and is available for general use.Server islands are Astro’s solution for highly cacheable pages of mixed static and dynamic content. They allow you to specify components that should run on the server, allowing the rest of the page to be more aggressively cached, or even generated statically.
Turn any
.astrocomponent into a server island by adding theserver:deferdirective and optionally, fallback placeholder content. It will be rendered dynamically at runtime outside the context of the rest of the page, allowing you to add longer cache headers for the pages, or even prerender them.---import Avatar from '../components/Avatar.astro';import GenericUser from '../components/GenericUser.astro';---<header><h1>Page Title</h1><div class="header-right"><Avatar server:defer><GenericUser slot="fallback" /></Avatar></div></header>If you were previously using this feature, please remove the experimental flag from your Astro config:
import { defineConfig } from 'astro/config';export default defineConfig({experimental {serverIslands: true,},});If you have been waiting for stabilization before using server islands, you can now do so.
Please see the server island documentation for more about this feature.
-
#11806
f7f2338Thanks @Princesseuh! - Adds a newlimitedvalue for the different properties ofsupportedAstroFeaturesfor adapters, which indicates that the adapter is compatible with the feature, but with some limitations. This is useful for adapters that support a feature, but not in all cases or with all options. -
#11925
74722cbThanks @florian-lefebvre! - Updatesastro/configimport to referenceastro/clienttypesWhen importing
astro/config, types fromastro/clientwill be made automatically available to your project. If your projecttsconfig.jsonchanges how references behave, you’ll still have access to these types after runningastro sync.
🐞 Patch Changes
-
#11974
60211deThanks @ascorbic! - Exports theRenderResulttype -
#11939
7b09c62Thanks @bholmesdev! - Adds support for Zod discriminated unions on Action form inputs. This allows forms with different inputs to be submitted to the same action, using a given input to decide which object should be used for validation.This example accepts either a
createorupdateform submission, and uses thetypefield to determine which object to validate against.import { defineAction } from 'astro:actions';import { z } from 'astro:schema';export const server = {changeUser: defineAction({accept: 'form',input: z.discriminatedUnion('type', [z.object({type: z.literal('create'),name: z.string(),email: z.string().email(),}),z.object({type: z.literal('update'),id: z.number(),name: z.string(),email: z.string().email(),}),]),async handler(input) {if (input.type === 'create') {// input is { type: 'create', name: string, email: string }} else {// input is { type: 'update', id: number, name: string, email: string }}},}),};The corresponding
createandupdateforms may look like this:---import { actions } from 'astro:actions';---<!--Create--><form action={actions.changeUser} method="POST"><input type="hidden" name="type" value="create" /><input type="text" name="name" required /><input type="email" name="email" required /><button type="submit">Create User</button></form><!--Update--><form action={actions.changeUser} method="POST"><input type="hidden" name="type" value="update" /><input type="hidden" name="id" value="user-123" /><input type="text" name="name" required /><input type="email" name="email" required /><button type="submit">Update User</button></form>