Question:
Why is my stylesheet not working? It is the correct path and everything but it wont load.
Repl link:
https://replit.com/@linkadmin/LinkAdmin-Site#src/views/home.ejs
code snippet
Question:
Why is my stylesheet not working? It is the correct path and everything but it wont load.
Repl link:
https://replit.com/@linkadmin/LinkAdmin-Site#src/views/home.ejs
code snippet
Hey, @linkadmin welcome to the forums!
It may be a bad file path to the stylesheet. Can you try this path? ../../public/stylesheets/style.css
Yea it still does the same thing.
Hmm… Possibly ../public/stylesheets/style.css
. I think we went back one too many directories
Still no luck.
In inspect this is the url its trying to get:
https://linkadmin-site.linkadmin.repl.co/public/stylesheets/style.css
Could it be something with my express static file serving?
Dont see any bugs on the issues tab of the GitHub repo. Unforetently I don’t have any more ideas and I don’t know Express. But I am sure somebody else here that knows Express can help you.
Thank you for your time!
I think you wanted to host this path:
app.use(express.static(path.join(__dirname, "src/public")));
Right now you are hosting this path:
(__dirname, "public")
You debugged the right path in console but you forgot src/
while hosting
Still wont work.
Path: …/…/public/stylesheets/style.css
Using src/public
actually works; but since you’re hosting the folder called public
and not a file, stylesheet is hosted at /stylesheets/style.css
.
You might host it under public
if you want the structure to be /public/stylesheet/style.css
like:
app.use('/public', express.static(path.join(__dirname, "src/public")));
One more important thing to note:
When you’re in a html repl you are referring to the file structure of the actual program, like if you want to refer to a file which is two folders before you’ll use ../../
but when you’re hosting it, you’re the one who decides how the web structure will be. It no longer works like your folder structure unless you want it to.
In simpler terms:
Like you’re hosting index.html
at root folder so when you want to call the stylesheet file, which is in the directory public/stylesheets/
(or just /stylesheets
if you don’t want to host it under /public
), you’ll call it like ./public/stylesheets/style.css
. For a better understanding, just open the url https://linkadmin-site.linkadmin.repl.co/stylesheets/style.css and here’s your stylesheet file as of now.
It works now thank you!
This topic was automatically closed 7 days after the last reply. New replies are no longer allowed.