diff --git a/.changeset/lovely-owls-sniff.md b/.changeset/lovely-owls-sniff.md new file mode 100644 index 0000000000..54b660770e --- /dev/null +++ b/.changeset/lovely-owls-sniff.md @@ -0,0 +1,6 @@ +--- +'astro': patch +'@astrojs/image': patch +--- + +Invalidates cache when changing serviceEntryPoint diff --git a/packages/astro/src/assets/utils/transformToPath.ts b/packages/astro/src/assets/utils/transformToPath.ts index 5a73fca3c6..1574af3146 100644 --- a/packages/astro/src/assets/utils/transformToPath.ts +++ b/packages/astro/src/assets/utils/transformToPath.ts @@ -4,7 +4,7 @@ import { shorthash } from '../../runtime/server/shorthash.js'; import { isESMImportedImage } from '../internal.js'; import type { ImageTransform } from '../types.js'; -export function propsToFilename(transform: ImageTransform) { +export function propsToFilename(transform: ImageTransform, imageService: string) { if (!isESMImportedImage(transform.src)) { return transform.src; } @@ -12,6 +12,9 @@ export function propsToFilename(transform: ImageTransform) { let filename = removeQueryString(transform.src.src); const ext = extname(filename); filename = basename(filename, ext); + // take everything from transform except alt, which is not used in the hash + const { alt, ...rest } = transform; + const hashFields = { ...rest, imageService }; const outputExt = transform.format ? `.${transform.format}` : ext; - return `/${filename}_${shorthash(JSON.stringify(transform))}${outputExt}`; + return `/${filename}_${shorthash(JSON.stringify(hashFields))}${outputExt}`; } diff --git a/packages/astro/src/assets/vite-plugin-assets.ts b/packages/astro/src/assets/vite-plugin-assets.ts index b42d714874..3d96d08f10 100644 --- a/packages/astro/src/assets/vite-plugin-assets.ts +++ b/packages/astro/src/assets/vite-plugin-assets.ts @@ -167,7 +167,10 @@ export default function assets({ } filePath = prependForwardSlash( - joinPaths(settings.config.build.assets, propsToFilename(options)) + joinPaths( + settings.config.build.assets, + propsToFilename(options, settings.config.image.service) + ) ); globalThis.astroAsset.staticImages.set(options, filePath); } diff --git a/packages/integrations/image/src/index.ts b/packages/integrations/image/src/index.ts index 3767003f32..d52ea38099 100644 --- a/packages/integrations/image/src/index.ts +++ b/packages/integrations/image/src/index.ts @@ -122,7 +122,7 @@ export default function integration(options: IntegrationOptions = {}): AstroInte ? staticImages.get(transform.src)! : new Map(); - const filename = propsToFilename(transform); + const filename = propsToFilename(transform, resolvedOptions.serviceEntryPoint); srcTranforms.set(filename, transform); staticImages.set(transform.src, srcTranforms); diff --git a/packages/integrations/image/src/loaders/index.ts b/packages/integrations/image/src/loaders/index.ts index 225e98cee9..1d4f77680d 100644 --- a/packages/integrations/image/src/loaders/index.ts +++ b/packages/integrations/image/src/loaders/index.ts @@ -94,6 +94,11 @@ export interface TransformOptions { * For remote images, provide the full URL. */ src: string; + /** + * The alt tag of the image. This is used for accessibility and will be made required in a future version. + * Empty string is allowed. + */ + alt?: string; /** * The output format to be used in the optimized image. * diff --git a/packages/integrations/image/src/utils/paths.ts b/packages/integrations/image/src/utils/paths.ts index 4592781ac9..023fdc143d 100644 --- a/packages/integrations/image/src/utils/paths.ts +++ b/packages/integrations/image/src/utils/paths.ts @@ -35,16 +35,19 @@ function basename(src: string) { return removeQueryString(src.replace(/^.*[\\\/]/, '')); } -export function propsToFilename(transform: TransformOptions) { +export function propsToFilename(transform: TransformOptions, serviceEntryPoint: string) { // strip off the querystring first, then remove the file extension let filename = removeQueryString(transform.src); + // take everything from transform except alt, which is not used in the hash + const { alt, ...rest } = transform; + const hashFields = { ...rest, serviceEntryPoint }; filename = basename(filename); const ext = extname(filename); filename = removeExtname(filename); const outputExt = transform.format ? `.${transform.format}` : ext; - return `/${filename}_${shorthash(JSON.stringify(transform))}${outputExt}`; + return `/${filename}_${shorthash(JSON.stringify(hashFields))}${outputExt}`; } export function appendForwardSlash(path: string) {