I recently downloaded one of my projects from Glitch. The project shows perfectly on the website, but when downloaded, none of the CSS seems to be showing up properly. When I open up index.html in Google Chrome it shows as a plain HTML page with no CSS styling. Anyone know how to fix this?
If your project is like hello-express, it’s because the directory structure of the project source code doesn’t match the directory structure of the app’s routes. The relative links in the views are coded for the directory structure of the app’s routes, but if you double clicked a view on disk, it opens in the directory structure of the project source code. So something like this
<link rel="stylesheet" href="style.css">
wouldn’t work when you open views/index.html when the stylesheet is in public/style.css.
change the href to be relative. the absolute / resolves differently on the filesystem. or maybe download the project into the root of your filesystem, but that would be a little crazy.
Yeah that’s what I ended up doing. Just copied the HTML files into a folder, put my css file inside resources/css/style.css in the same folder as my HTML files. Edited the HTML files locally so the href is ./resources/css/style.css and it worked. Thanks for the help!