In this episode, we dig into the concept of the public
folder in a Nuxt project. If you have files—like images or logos—that you don't need to be included in your code bundle but should still be accessible publicly, the public
folder is the perfect spot for them.
We walk through creating a public
directory in the root of your project and show how any files you drop in here will be directly available on your web server. As an example, we add a logo SVG, then reference it right at the top of the homepage with a normal <img src="/logo.svg">
tag. We even touch on organizing your public assets by using subdirectories if you want to keep things tidy.
Finally, we briefly look at some styling, giving our logo a size in the app.css
file. We also discuss that certain things—like stylesheets written in SCSS/Sass—shouldn’t go into the public directory because they need to be compiled and bundled. The public
folder is really just for things you want directly available at their URL without any special processing. This is a great spot for logos, plain images, and other assets you want the webserver to serve as-is.