diff --git a/docs/get-started/nextjs.md b/docs/get-started/nextjs.md index 6cbd4ac91177..b17cf19661b3 100644 --- a/docs/get-started/nextjs.md +++ b/docs/get-started/nextjs.md @@ -865,6 +865,24 @@ You might get this if you're using Yarn v2 or v3. See [Notes for Yarn v2 and v3 The `@storybook/nextjs` package abstracts the Webpack 5 builder and provides all the necessary Webpack configuration needed (and used internally) by Next.js. Webpack is currently the official builder in Next.js, and Next.js does not support Vite, therefore it is not possible to use Vite with `@storybook/nextjs`. You can use `@storybook/react-vite` framework instead, but at the cost of having a degraded experience, and we won't be able to provide you official support. +### Error: You are importing avif images, but you don't have sharp installed. You have to install sharp in order to use image optimization features in Next.js. + +`sharp` is a dependency of Next.js's image optimization feature. If you see this error, you need to install `sharp` in your project. + +```bash +npm install sharp +``` + +```bash +yarn add sharp +``` + +```bash +pnpm add sharp +``` + +You can refer to the [Install `sharp` to Use Built-In Image Optimization](https://nextjs.org/docs/messages/install-sharp) in the Next.js documentation for more information. + ## API ### Parameters