search

vercel / next.js

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

Next JS app built using output: 'export' not rendered properly #64961

Open tusharvelingkar opened 6 months ago

tusharvelingkar commented 6 months ago

Link to the code that reproduces this issue

https://github.com/tusharvelingkar/static-export-bug

To Reproduce

  1. Create new nextjs app
  2. Update next config to output as static site
  3. Open the outputted page from out folder

Current vs. Expected behavior

Current Output image

Expected Output image Above output is when app run using dev mode

Provide environment information

Operating System:
  Platform: linux
  Arch: x64
  Version: #1 SMP Thu Mar 14 14:20:09 EDT 2024
  Available memory (MB): 31893
  Available CPU cores: 8
Binaries:
  Node: 20.11.1
  npm: 10.2.4
  Yarn: 1.22.19
  pnpm: 8.12.1
Relevant Packages:
  next: 14.2.2 // Latest available version is detected (14.2.2).
  eslint-config-next: 14.2.2
  react: 18.2.0
  react-dom: 18.2.0
  typescript: 5.4.5
Next.js Config:
  output: export

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

create-next-app

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

next build (local)

Additional context

No response

shinjith-dev commented 4 months ago

It's happening because link (and script) tags in static export html is using absolute path rather than relative path of the respective file. For instance, 

href="/_next/static/css/39e63e6be2f0f97f.css"

rather than

href="./_next/static/css/39e63e6be2f0f97f.css"

I had to replace all the paths (src and href) to make it up to my needs :(