diff options
| author |  Erika <3019731+Princesseuh@users.noreply.github.com>
| 2024-04-12 10:07:27 -0400 |
|---|---|---|
| committer |  GitHub <noreply@github.com>
| 2024-04-12 16:07:27 +0200 |
| commit | c75ededdb401cfa55e1ad2682d5e95494f49604e (patch) | |
| tree | ad4cc79dae8cbb05ecc8ca686c5aedfef855ddb1 | |
| parent | 17c2bb1aad7eb1eb5a0dcb8d5ea5be24abcdddc7 (diff) | |
| download | astro-c75ededdb401cfa55e1ad2682d5e95494f49604e.tar.gz astro-c75ededdb401cfa55e1ad2682d5e95494f49604e.tar.zst astro-c75ededdb401cfa55e1ad2682d5e95494f49604e.zip | |
fix(vercel): Fix srcset generation not working on Vercel (#10756)
* fix(vercel): Fix `srcset` generation not working on Vercel
* chore: changeset
* fix: remove densities and widths from the HTML attributes
* nit: better changeset
* nit: add formats
| -rw-r--r-- | .changeset/nine-radios-peel.md | 7 | ||||
| -rw-r--r-- | packages/integrations/vercel/src/image/build-service.ts | 4 | ||||
| -rw-r--r-- | packages/integrations/vercel/src/image/shared-dev-service.ts | 2 |
3 files changed, 12 insertions, 1 deletions
diff --git a/.changeset/nine-radios-peel.md b/.changeset/nine-radios-peel.md new file mode 100644 index 000000000..fece80eb9 --- /dev/null +++ b/.changeset/nine-radios-peel.md @@ -0,0 +1,7 @@ +--- +"@astrojs/vercel": patch +--- + +Fixes `widths` and `densities` not working when using Vercel's Image Optimization. + +Note that you still need to make sure that the widths you're outputting are enabled in [the `imageConfig` property of the Vercel adapter](https://docs.astro.build/en/guides/integrations-guide/vercel/#imagesconfig) in order for these properties to work. diff --git a/packages/integrations/vercel/src/image/build-service.ts b/packages/integrations/vercel/src/image/build-service.ts index bd58d3af6..7e991161a 100644 --- a/packages/integrations/vercel/src/image/build-service.ts +++ b/packages/integrations/vercel/src/image/build-service.ts @@ -1,7 +1,9 @@ import type { ExternalImageService } from 'astro'; import { isESMImportedImage, sharedValidateOptions } from './shared.js'; +import { baseService } from 'astro/assets'; const service: ExternalImageService = { + ...baseService, validateOptions: (options, serviceOptions) => sharedValidateOptions(options, serviceOptions.service.config, 'production'), getHTMLAttributes(options) { @@ -29,7 +31,7 @@ const service: ExternalImageService = { } } - const { src, width, height, format, quality, ...attributes } = props; + const { src, width, height, format, quality, densities, widths, formats, ...attributes } = options; return { ...attributes, diff --git a/packages/integrations/vercel/src/image/shared-dev-service.ts b/packages/integrations/vercel/src/image/shared-dev-service.ts index 4251603a7..8ca87e99a 100644 --- a/packages/integrations/vercel/src/image/shared-dev-service.ts +++ b/packages/integrations/vercel/src/image/shared-dev-service.ts @@ -1,7 +1,9 @@ import type { LocalImageService } from 'astro'; +import { baseService } from 'astro/assets'; import { sharedValidateOptions } from './shared.js'; export const baseDevService: Omit<LocalImageService, 'transform'> = { + ...baseService, validateOptions: (options, serviceOptions) => sharedValidateOptions(options, serviceOptions.service.config, 'development'), getURL(options) { |