-1

I thought this was a relatively straightforward thing to do but apparently not. I have a bg image in a global scss file that does not wwant to render. It seems all of the other styles in the file are working and I don't belive the file paths are the problem but I could be wrong since the new app dir in Next 13 is throwing me for a loop. Any help would be appreciated, below is my folder structure and also the scss causing issues. enter image description here

I'll be happy to provide any other info as needed.

  • Also i get this error in the dev tools console: p://localhost:3000/public/bg.jpg 404 (Not Found) in some layout.css file that i dont see.
Mr_Yellow7
  • 27
  • 5

2 Answers2

1

You don't need to add public in path to access assets in public folder. You can simply do it like /bg.jpg to access the bg.jpg image in public folder. Files inside public folder can be referenced with the base URL /.

I would still recommend you to keep all your images in an images folder and move that to an assets folder inside your public folder. Then you can access your images like this. /assets/images/bg.jpg

PK_
  • 400
  • 2
  • 8
  • Interesting, thank you. What's funny is that if I tried referencing the image using the way that the other answer was given, I was getting another type of error even though it should still technically work. Regardless, this fixed it. – Mr_Yellow7 May 09 '23 at 20:22
0

Please reframe from posting screenshots of code as it makes it very difficult to help debug.

I believe the issue is that you are referencing the image inside the styles folder, but your image path isn't pointing to the right directory.

Because you provided no code in text form, I can't test it, but replacing your path with

../public/bg.jpg

should fix it.

rguarascia.ts
  • 694
  • 7
  • 19