1a8ad14089
Since we are no longer accepting new built-in loaders, users may wish to use a different cloud provider. So this PR renames `dangerously-unoptimized` to `custom` to handle this case as well as the intention of `next export`. If the user doesn't add a `loader` prop, we throw an error. If the user adds a `loader` prop but it doesn't return the width, we print a warning. - Follow up to #26847 - Fixes #21079 - Fixes #19612 - Related to #26850
17 lines
1.1 KiB
Markdown
17 lines
1.1 KiB
Markdown
# Missing `width` in the URL Returned by the Loader Prop on `next/image`
|
|
|
|
#### Why This Error Occurred
|
|
|
|
The [`loader`](https://nextjs.org/docs/api-reference/next/image#loader) prop on the `next/image` component allows you to override the built-in URL resolution with a custom implementation in order to support any 3rd party cloud provider that can perform Image Optimization.
|
|
|
|
This error occurred because the provided `loader()` function did not use `width` in the returned URL string. This means that the image will likely not be resized and therefore degrade performance.
|
|
|
|
#### Possible Ways to Fix It
|
|
|
|
- Ensure your Image Optimization provider can resize images. Then use the `width` parameter from the [`loader()`](https://nextjs.org/docs/api-reference/next/image#loader) function to construct the correct URL string.
|
|
- Add the [`unoptimized`](https://nextjs.org/docs/api-reference/next/image#unoptimized) prop.
|
|
|
|
### Useful Links
|
|
|
|
- [Image Optimization Documentation](https://nextjs.org/docs/basic-features/image-optimization)
|
|
- [`next/image` Documentation](https://nextjs.org/docs/api-reference/next/image)
|