1

I've checked everything, the path is correct , I've already declared the the "public" folder for the static files. please help me figure it out. this is how it should look

this is the site when I run it in my local server, everything loads fine here.

But when I added and deployed it on Heroku, this is how it looks

There's no image and custom CSS, only bootstrap loaded correctly, which is not stored locally

I get this error for the image: GET https://glacial-retreat-59003.herokuapp.com/images/download.jpg 404 (Not Found)

and this one for the css: Refused to apply style from 'https://glacial-retreat-59003.herokuapp.com/css/styles.css' because its MIME type ('text/html') is not a supported stylesheet MIME type, and strict MIME checking is enabled.

I googled them all but none of the solutions worked, plus the errors seem like are caused due to not correctly writing directory/path for the files, but I checked several times and that's not the case.

this is the .js file , to show the directories I added are correct

app.use(express.static("public/"));

this is the HTML file , where i added css file and image

<link href="css/styles.css" rel="stylesheet" type="text/css">



<img class="mb-4 img" src="images/download.jpg" alt="" >
torek
  • 448,244
  • 59
  • 642
  • 775
Shiwam Singroul
  • 11
  • 2
  • Can you show your file* structure? And did you try `express.static(__dirname + '/public')`? Notice the `__dirname` part. Seems a standard way of difining files in Node.js. See https://stackoverflow.com/a/48666785/11592836 – Allart Nov 08 '21 at 15:21
  • thank you for replying, yeah I did see that post, but in that post the css wasn't even loading on his local server, but in my case it works perfectly on the local server. I didn't specify the dirname cause I thought we had to give the "public" folder's location relative the app.js, so i thought it wasn't necessary since they're both in the same directory, but I'll try that now. Also you can see the file structure on left in the last two images I linked. – Shiwam Singroul Nov 08 '21 at 15:35
  • So I added "__dirname" and the css file and the image even stopped loading on my local server, so I don't think it will work if I add the files to Heroku – Shiwam Singroul Nov 08 '21 at 15:42
  • So turns out I forgot a "/" before "public", but even after i fixed it , it only works fine in my local server and doesn't work online – Shiwam Singroul Nov 09 '21 at 12:07
  • Try out some more with this. I dont know how to fix it but im pretty sure you messed something up in the linking process. Keep trying new combinations and keep track of the errors given. Based on the errors I useally can figure out why things work and why not. – Allart Nov 09 '21 at 12:11
  • Even now I couldn't figure out what's wrong? If it was typo or syntax error, it wouldn't even work on my local server, but it works completely fine on it, the problem only occurs once I try load the website through Heroku's servers – Shiwam Singroul Dec 25 '21 at 13:00

0 Answers0