Design comparison
Solution retrospective
For some reason the images isn't getting loading in github pages
Community feedback
- @EileenpkPosted almost 2 years ago
Hi Gulimanto! your project looks great, I see that you are using Vite for this project. In the Vite framework, the public folder is the root directory for static assets that are served directly by the server. This means that any files placed in the public folder can be accessed by a client by simply requesting the file at its relative path.
So to make your image show up, move the image folder into the public folder, you can then reference it in an HTML file like this:
<img src="/images/image-qr-code.png" alt="My Image">
If you try to reference a file that is outside of the public folder, the server will not be able to access it and the file will not be served to the client.
It's worth noting that the public folder is not the only place where you can store static assets in a Vite project. You can also use the static directory, which is a sibling of the src directory and is also served directly by the server. However, the public folder is generally used for assets that need to be directly accessible by the client, such as images, fonts, and other media files.
If you found this helpful please mark it as such :)
- Let's connect on LinkedIn! - @Eileenpk
1
Please log in to post a comment
Log in with GitHubJoin our Discord community
Join thousands of Frontend Mentor community members taking the challenges, sharing resources, helping each other, and chatting about all things front-end!
Join our Discord