search

vercel / next.js

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

Images are not displayed when using examples/app-dir-i18n-routing #53053

Open sameer55chauhan opened 1 year ago

sameer55chauhan commented 1 year ago

Verify canary release

Provide environment information

Operating System:
      Platform: win32
      Arch: x64
      Version: Windows 10 Home Single Language
    Binaries:
      Node: 16.20.0
      npm: N/A
      Yarn: N/A
      pnpm: 8.6.7
    Relevant Packages:
      next: 13.4.12-canary.0
      eslint-config-next: N/A
      react: 18.2.0
      react-dom: 18.2.0
      typescript: 4.8.4
    Next.js Config:
      output: N/A

Which example does this report relate to?

app-dir-i18n-routing

What browser are you using? (if relevant)

Google Chrome Version 115.0.5790.102 (Official Build) (64-bit)

How are you deploying your application? (if relevant)

Vercel

Describe the Bug

In my personal project, chauhan.org.in tried to set up Localization by following the example i18n-routing and official docs. The localization works perfectly but the images stored in /public are not displayed.

Code in page.tsx: <Image className="w-full h-full relative object-cover dark:brightness-50" src="/public/GEKKO.png" alt="any" fill />

Error: image not displayed

VS Code Screenshot for file structure and code: Screenshot 2023-07-23 002649

Expected Behavior

The images should be displayed properly!

To Reproduce

pnpm create next-app --example app-dir-i18n-routing i18n-app edit the file page.tsx pnpm run dev

Clickadelic commented 12 months ago

Same issue here, same starting point. Any updates on this?

yanyu0222 commented 8 months ago

My image can be displayed after using the solution below:

https://stackoverflow.com/questions/76293301/the-images-do-not-work-with-a-tutorial-to-follow-to-make-my-page-in-nextjs-with