Building a Static Website in a Folder: Relative Paths

I'm not sure how to ask the question properly as I'm not very fluent in english.

I know about absolute paths and relative paths. I also know that relative paths can either be relative to the domain or root folder, or relative to the file itself.

When I build a static site inside a folder I manually created without the help of builders (e.g. creating a new .html file, .css file, etc manually and structuring it properly inside my folder) I can move that folder wherever I want to, I would only have to make sure that whenever I call an asset inside an html file, the path should be relative to the html file itself, and the website will work almost 100% of the time. However, I noticed that whenever I build a website with the help of a builder (e.g. Astro.build with npm run build command), naturally it spawns a dist folder where the website will live, the website only works if you put it in the root folder of the domain want, or configure the builder to build the website so that it will work in a sub-folder of the domain you want (e.g localhost/subfolder).

When the builder builds the website like that, it almost always uses paths relative to the domain or the subfolder of the domain I configured it to, causing it to only work on either the root, or if i configured it to the subfolder, the specific subfolder. The website won't work if I move the folder wherever I want to, like for example if i want the folder in my downloads folder, the index.html file won't look like what i intended it to look because the paths to the assets like the css files and images, all points from the root to where the assets are supposed to be, instead of pointing from the index.html file to the assets.

I guess my question is, why does builders almost always use the paths relative to the root? Wouldn't it be very convenient for builders to spawn the dist folder and the website would work anywhere regardless of where the dist folder is?
Was this page helpful?