vercel / vercel/next.js

next/image in dev does not update local image after file edit with same filename

Open
#93,075 3 comments 2 reactions 0 assignees View on GitHub

Nobody has claimed this yet.

Dominant language
JavaScript
Stars
142k
Forks
32.4k
Avg merge
2d 14h
Merged PRs (30d)
351

Description

Link to the code that reproduces this issue

https://github.com/Austin1serb/next.js-minimal-build

To Reproduce
  1. Clone the reproduction repo.
  2. Install dependencies.
  3. Start the app in development mode with next dev.
  4. Open the page in the browser.
  5. The page renders the same local image twice, once with next/image and once with a plain <img>.
  6. Edit the source image file used by both elements without changing its filename.
  7. Refresh the page.
  8. The plain <img> shows the updated image, but next/image still shows the old image.
  9. Rename the image file or delete .next and restart the dev server.
  10. next/image then shows the updated image.
Current vs. Expected behavior

Expected:
Both next/image and plain <img> should reflect the updated local file in development after the image contents change.

Current:
Only the plain <img> updates. next/image continues to show a stale version when the file contents change but the filename stays the same.

Workarounds:

  • rename the image file
  • delete .next and restart next dev
Provide environment information
Operating System:
  Platform: darwin
  Arch: arm64
  Version: Darwin Kernel Version 25.3.0: Wed Jan 28 20:54:22 PST 2026; root:xnu-12377.81.4~5/RELEASE_ARM64_T8112
  Available memory (MB): 16384
  Available CPU cores: 8
Binaries:
  Node: 24.14.1
  npm: 11.11.0
  Yarn: 1.22.22
  pnpm: 10.33.0
Relevant Packages:
  next: 16.2.4 // Latest available version is detected (16.2.4).
  eslint-config-next: N/A
  react: 19.2.5
  react-dom: 19.2.5
  typescript: N/A
Next.js Config:
  output: N/A
Which area(s) are affected? (Select all that apply)

Image

Which stage(s) are affected? (Select all that apply)

next dev

Additional context

This is specifically about local development.
The reproduction shows a difference between next/image and plain <img> using the same local source image.

Contributor guide

Open the contributing guide

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

Research direction

Run the linked minimal reproduction with next dev, compare next/image with the plain <img> after editing the same local file, and inspect the development image handling and .next behavior. Done means the next/image output reflects changed local image contents without renaming the file or deleting .next.

Written by the indexing model from the issue text.

Assessment

Tech stack
javascript, nextjs, react
Domain
frontend, tooling
Issue type
Bug
Difficulty
3/5
Estimated time
1-2 days
Activity status
Quiet
Clarity
Mostly clear
Newbie friendliness
55/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.