π Patch Changes
-
#14473
d9634d3Thanks @florian-lefebvre! - Fixes a bug that caused too many files to be bundled in SSR -
Updated dependencies [
b8ca69b]:- @astrojs/internal-helpers@0.7.4
#14473 d9634d3 Thanks @florian-lefebvre! - Fixes a bug that caused too many files to be bundled in SSR
Updated dependencies [b8ca69b]:
1e2499e]:
4d16de7]:
0567fb7]:
f4e8889]:
de5a253 Thanks @RobbieTheWagner! - Allow setting domains to undefined in imagesConfig so that remotePatterns can be better utilized for images from a variety of domains.db8f8be Thanks @ematipico! - Fixes the internal implementation of the new feature experimentalStaticHeaders, where dynamic routes
were mapped to use always the same header.#13965 95ece06 Thanks @ematipico! - Adds support for the experimental static headers Astro feature.
When the feature is enabled via option experimentalStaticHeaders, and experimental Content Security Policy is enabled, the adapter will generate Response headers for static pages, which allows support for CSP directives that are not supported inside a <meta> tag (e.g. frame-ancestors).
import { defineConfig } from 'astro/config';import vercel from '@astrojs/vercel';
export default defineConfig({ adapter: vercel({ experimentalStaticHeaders: true, }), experimental: { cps: true, },});#13917 e615216 Thanks @ascorbic! - The responsive images feature introduced behind a flag in v5.0.0 is no longer experimental and is available for general use.
The new responsive images feature in Astro automatically generates optimized images for different screen sizes and resolutions, and applies the correct attributes to ensure that images are displayed correctly on all devices.
Enable the image.responsiveStyles option in your Astro config. Then, set a layout attribute on any image.layout, for instantly responsive images with automatically generated srcset and sizes attributes based on the imageβs dimensions and the layout type.
Displaying images correctly on the web can be challenging, and is one of the most common performance issues seen in sites. This new feature simplifies the most challenging part of the process: serving your site visitor an image optimized for their viewing experience, and for your websiteβs performance.
For full details, see the updated Image guide.
The experimental.responsiveImages flag has been removed, and all experimental image configuration options have been renamed to their final names.
If you were using the experimental responsive images feature, youβll need to update your configuration:
export default defineConfig({ experimental: { responsiveImages: true, },});During the experimental phase, default styles were applied automatically to responsive images. Now, you need to explicitly set the responsiveStyles option to true if you want these styles applied.
export default defineConfig({ image: { responsiveStyles: true, },});The experimental image configuration options have been renamed:
Before:
export default defineConfig({ image: { experimentalLayout: 'constrained', experimentalObjectFit: 'cover', experimentalObjectPosition: 'center', experimentalBreakpoints: [640, 750, 828, 1080, 1280], experimentalDefaultStyles: true, }, experimental: { responsiveImages: true, },});After:
export default defineConfig({ image: { layout: 'constrained', objectFit: 'cover', objectPosition: 'center', breakpoints: [640, 750, 828, 1080, 1280], responsiveStyles: true, // This is now *false* by default },});The layout, fit, and position props on <Image> and <Picture> components work exactly the same as before:
<Image src={myImage} alt="A responsive image" layout="constrained" fit="cover" position="center"/>If you werenβt using the experimental responsive images feature, no changes are required.
Please see the Image guide for more information on using responsive images in Astro.
Updated dependencies []:
4a8f193 Thanks @moonclavedev! - Handle SVG images correctly in build image service5dd2d3f Thanks @florian-lefebvre! - Removes unused code042d1de]:
#13211 7ea0aba Thanks @slawekkolodziej! - Adds support for regular expressions in ISR exclude list
Previously, excluding a page from ISR required explicitly listing it in isr.exclude. As websites grew larger, maintaining this list became increasingly difficult, especially for multiple API routes and pages that needed server-side rendering.
To address this, ISR exclusions now support regular expressions, allowing for more flexible and scalable configurations.
import vercel from '@astrojs/vercel/serverless';
export default defineConfig({ output: 'server', adapter: vercel({ isr: { exclude: [ '/preview', // Excludes a specific route (e.g., pages/preview.astro) '/auth/[page]', // Excludes a dynamic route (e.g., pages/auth/[page].astro) /^\/api\/.+/, // Excludes all routes starting with /api/ ], }, }),});#13323 80926fa Thanks @ematipico! - Updates esbuild and vite to the latest to avoid false positives audits warnings caused by esbuild.
Updated dependencies [1e11f5e]:
#11679 ea71b90 Thanks @florian-lefebvre! - Adds stable support for astro:env
#11770 cfa6a47 Thanks @Princesseuh! - Removed support for the Squoosh image service. As the underlying library libsquoosh is no longer maintained, and the image service sees very little usage we have decided to remove it from Astro.
Our recommendation is to use the base Sharp image service, which is more powerful, faster, and more actively maintained.
import { squooshImageService } from "astro/config";import { defineConfig } from "astro/config";
export default defineConfig({ image: { service: squooshImageService() }});If you are using this service, and cannot migrate to the base Sharp image service, a third-party extraction of the previous service is available here: https://github.com/Princesseuh/astro-image-service-squoosh
#11728 5ea02b1 Thanks @matthewp! - Deprecates the functionPerRoute option
This option is now deprecated, and will be removed entirely in Astro v5.0. We suggest removing this option from your configuration as soon as you are able to:
import { defineConfig } from 'astro/config';import vercel from '@astrojs/vercel/serverless';
export default defineConfig({ // ... output: 'server', adapter: vercel({ functionPerRoute: true, }),});