Webserver lädt CSS nicht

12/12/2018 12:46 .BritainAndy#1
Hallo zusammen,
Ich hab ein Problem und kriegs irgendwie nicht gelöst.
Ich wollte aus Testgründen eine kleine Website erstellen, die den BMI errechnet.
Dabei will ich die Berechnung im Backend durchführen und nutze dafür NodeJS mit dem ExpressJS framework.


Mein Problem ist folgendes:
Wenn ich die website statisch im Browser betrachte, also unter "file:///home/xxx/index.html" wird alles richtig dargestellt.
Wenn ich aber nun den kleinen webserver starte und mir die Seite unter "http://localhost:3000/" anschaue, wird meine CSS-Datei nicht geladen und ich kriege auch folgenden Fehler :
Quote:
Refused to apply style from 'http://localhost:3000/css/style.css' because its MIME type ('text/html') is not a supported stylesheet MIME type, and strict MIME checking is enabled.
Habe natürlich schon gegoogelt und habe folgende Lösungansätze probiert die aber nicht geholfen haben:


So sollte es eigentlich aussehen:

So sieht es aus:

Leider hat nichts davon geholfen.
Ich würde mich über jede Hilfe freuen!

Liebe Grüße :handsdown:
12/12/2018 18:18 Serraniel#2
Wie sieht denn dein head Block aktuell aus von der Art wie du die css einbindest?
12/12/2018 18:42 .BritainAndy#3
Der head-Block sieht wie folgt aus:

und meine index.js die den Server started:
12/12/2018 22:21 False#4
Wieso nutzt du type="text/html" ?
Es müsste type="text/css" logischerweiße sein da du eine css Datei einbindest und kein Html !
Kenne mich aber mit dem javashit gedönse leider nicht so aus, aber evtl. reicht da ja schon..
Hast du den in den Devtools geschaut ob die Dateigeladen wird und mit welchem Mimetype ?
12/12/2018 23:09 .BritainAndy#5
Edit//

Ich habe es gelöst.
Ich musste in der index.js folgendes hinzurügen:


Danke für eure Hilfe!
12/13/2018 20:08 False#6
Quote:
Originally Posted by .BritainAndy View Post
Edit//

Ich habe es gelöst.
Ich musste in der index.js folgendes hinzurügen:


Danke für eure Hilfe!
Sieht sehr unschön aus und wird auch nicht die Lösung sein die das Framework "vorsieht".
Habe mal nach "expressjs static files" gegoogelt und das erste Egebniss war [Only registered and activated users can see links. Click Here To Register...].
Dort wird eine bessere Möglichkeit erklärt undzwar folgende:
Code:
app.use(express.static('public'));
Mit dieser Zeile werden automatisch dann alle Dateien im public Ordner ausgelieft wenn diese angefragt werden.
Andere Beispiele findest du auf der Seite.
12/13/2018 23:29 .BritainAndy#7
Vielen lieben Dank!

So ist es viel schöner!

Lg