Folder structure and modifications
In Chapter 1, The Vue 3 Framework, we mentioned that frameworks prescribe some structure for your application. Vue 3 is not an exception, but the conventions used in the directory structure are minimal when compared to other frameworks. If you open the directory where you installed the project in the Files Explorer (either from your OS or in your IDE), you will find a structure like this one:
Figure 3.3: Project structure in Visual Code
The .vscode
folder was created by the IDE, and node_modules
was created by npm
to allocate the dependencies. We will ignore them, as we don’t need to worry or work with them. Starting from the top, let’s review what each directory is:
public
This folder contains a directory structure and files that will not be processed by the bundler and will be copied directly into the final website. You can freely place your own static content here. This is where you will...