Skip to content

Commit 26d9f17

Browse files
authored
docs: update migration docs for next/image (#5326)
1 parent af388a8 commit 26d9f17

File tree

1 file changed

+23
-0
lines changed

1 file changed

+23
-0
lines changed

docs/start/framework/react/migrate-from-next-js.md

Lines changed: 23 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -304,6 +304,29 @@ function Component() {
304304

305305
Learn more about the [Links](/router/latest/docs/framework/react/guide/navigation#link-component).
306306

307+
### Images
308+
309+
Next.js uses the `next/image` component for optimized images. In TanStack Start, you can use the package called [Unpic](https://unpic.pics/) for similar functionality
310+
and almost a drop-in replacement.
311+
312+
```tsx
313+
import Image from "next/image" // [!code --]
314+
import { Image } from "@unpic/react"; // [!code ++]
315+
function Component() {
316+
return (
317+
<Image
318+
src="/path/to/image.jpg"
319+
alt="Description"
320+
width="600" // [!code --]
321+
height="400" // [!code --]
322+
width={600} // [!code ++]
323+
height={400} // [!code ++]
324+
/>
325+
)
326+
}
327+
```
328+
329+
307330
### Server ~Actions~ Functions
308331

309332
```tsx

0 commit comments

Comments
 (0)