feat(image): Update image service config to allow passing settings to the service

[Princesseuh]

Changes

Certain image services need a separate config, this is applicable for both remote and local image services. For instance, you might want a setting to restrict the remote patterns supported. Or for remote services, maybe your service only support a certain amount of widths and heights, or you can set defaults etc etc.

It looks like this:

export default defineConfig({
  experimental: {
    assets: true,
  },
  image: {
    service: { entrypoint: "./src/imageService.ts", config: {widths: [300, 600]}}
  },
});

and the settings are passed to all the hooks as a second parameter:

const service: ExternalImageService = {
  validateOptions(options, serviceOptions) {
  	if (!serviceOptions.widths.includes(options.width)) {
  		throw new Error("Specified width is not currently present in your service config")
  	}
  }
}

---

Since we have a new shape, I also added utilities functions to astro/assets to set the service:

import { squooshImageService } from "astro/assets/;

export default defineConfig({
  experimental: {
    assets: true,
  },
  image: {
    service: squooshImageService()
  },
});

Testing

Added a test

Docs

withastro/docs#3096

[changeset-bot]

🦋 Changeset detected

Latest commit: 4b6915f

The changes in this PR will be included in the next version bump.

Not sure what this means? Click here to learn what changesets are.

Click here if you're a maintainer who wants to add another changeset to this PR

[sarah11918]

I'm just curious because I don't know: Do we need to worry about updating the version number here since this specific configuration will only be appropriate for 2.3.x? (Even though image.service itself was added in 2.1.0?)

Are we at all worried about this being misleading for someone who happens to be on a slightly older version of Astro before this update to the image service config?

[bluwy]

The general implementation looks good to me