vercel / next.js

The React Framework
https://nextjs.org
MIT License
127.41k stars 27.03k forks source link

Hot reload doesn't work inside Docker container #71622

Open ArtoszBart opened 1 month ago

ArtoszBart commented 1 month ago

Link to the code that reproduces this issue

https://github.com/ArtoszBart/next-issue

To Reproduce

  1. docker-compose up
  2. make change in page.tsx
  3. save changes

Current vs. Expected behavior

Hot reload should reload the page to show changes, but changes is not visible in the browser

Provide environment information

Physical PC:
Operating System:
  Platform: win32
  Arch: x64
  Version: Windows 10 Education
  Available memory (MB): 16319
  Available CPU cores: 16
Binaries:
  Node: 20.18.0
  npm: N/A
  Yarn: N/A
  pnpm: N/A
Relevant Packages:
  next: 15.0.0 // Latest available version is detected (15.0.0).
  eslint-config-next: 15.0.0
  react: 19.0.0-rc-65a56d0e-20241020
  react-dom: 19.0.0-rc-65a56d0e-20241020
  typescript: 5.6.3
Next.js Config:
  output: N/A

Container:
Operating System:
  Platform: linux
  Arch: x64
  Version: #1 SMP Fri Mar 29 23:14:13 UTC 2024
  Available memory (MB): 7911
  Available CPU cores: 16
Binaries:
  Node: 20.18.0
  npm: 10.8.2
  Yarn: 1.22.22
  pnpm: N/A
Relevant Packages:
  next: 15.0.0 // Latest available version is detected (15.0.0).
  eslint-config-next: 15.0.0
  react: 19.0.0-rc-65a56d0e-20241020
  react-dom: 19.0.0-rc-65a56d0e-20241020
  typescript: 5.6.3
Next.js Config:
  output: N/A

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

Developer Experience

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

next dev (local)

Additional context

After saving changes in page.tsx on the PC, the .next/server/chunks/ssr on PC is updated same as page.tsx in container. However .next/server/chunks/ssr in container remains not updated.

lubieowoce commented 1 month ago

Isn't this COPY . . only going to copy the source once, when you build up the container? https://github.com/ArtoszBart/next-issue/blob/2e6ac6b3f252f172327d0ec22d205ad46ce1df63/Dockerfile.dev#L6

I'm pretty sure that if you want "outside" changes to be reflected inside the container in real time (without rebuilding), you need to mount the directory as a volume instead of just copying it.

ArtoszBart commented 1 month ago

Isn't this COPY . . only going to copy the source once, when you start up the container? https://github.com/ArtoszBart/next-issue/blob/2e6ac6b3f252f172327d0ec22d205ad46ce1df63/Dockerfile.dev#L6

I'm pretty sure that if you want "outside" changes to be reflected inside the container in real time (without restarting compose), you need to mount the directory as a volume instead of just copying.

Exactly. Volume mapping is in the docker-compose.yml file.

As I said earlier:

After saving changes in page.tsx on the PC, the .next/server/chunks/ssr on PC is updated same as page.tsx in container

nyxb commented 1 month ago

Same problem here in nextjs 15 doesnt work wit turbopack in nextjs 14.2.5 its work

nvm after I mirrored this one it works somehow: volumes:

- ./:/app
- ./apps/web/node_modules:/app/apps/web/node_modules
- ./apps/web/.next:/app/apps/web/.next
ArtoszBart commented 4 weeks ago

Downgraded to next@14.2.16:

With:

    volumes:
      - ./:/app

After saving changes in page.tsx on the PC, the .next/server/app/page.js both on PC and container is updated same as page.tsx in container. However changes in app running inside container remains not updated in browser. After page reload i have:

Server Error

Error: Could not find the module "/app/node_modules/next/dist/client/components/app-router.js#" in the React Client Manifest. This is probably a bug in the React Server Components bundler.

The same error occurs with:

    volumes:
      - ./:/app
      - ./node_modules:/app/node_modules
      - ./.next:/app/.next
nicobertolucci commented 3 days ago

Having same issue with "next": "^15.0.0". Adding volume change is updated in docker but log never compile the new update.