Heim > Web-Frontend > CSS-Tutorial > Hauptteil

Wie binde ich CSS-Dateien ordnungsgemäß in Node.js-, Express- und EJS-Projekte ein?

Patricia Arquette
Freigeben: 2024-10-26 00:40:28
Original
783 Leute haben es durchsucht

How to Properly Include CSS Files in Node.js, Express, and EJS Projects?

Einbinden von CSS-Dateien in Node-, Express- und EJS-Anwendungen

Bei der Arbeit mit Node.js, Express und EJS können Probleme auftreten Schwierigkeiten beim Einbinden von CSS-Dateien in Ihr Projekt. Dieses Problem tritt auf, wenn der Typ der CSS-Datei in der Entwicklerkonsole fälschlicherweise auf „text/html“ statt auf „text/css“ eingestellt ist.

Um dieses Problem zu beheben, führen Sie die folgenden Schritte aus:

In der server.js-Datei:

<code class="js">app.use(express.static(__dirname + '/public'));</code>
Nach dem Login kopieren

Diese Zeile stellt sicher, dass statische Dateien, einschließlich CSS, aus dem Verzeichnis „public“ bereitgestellt werden.

In der EJS-Datei:

<code class="ejs"><link rel="stylesheet" type="text/css" href="css/style.css"></code>
Nach dem Login kopieren

Beachten Sie, dass Sie vor dem Verzeichnis „css“ keinen führenden Schrägstrich „/“ einfügen müssen.

Erklärung:

  • Das Einfügen des Verzeichnisses „/public“ als statischer Dateipfad stellt sicher, dass CSS-Dateien korrekt bereitgestellt werden.
  • Die Angabe des korrekten CSS-Dateipfads in EJS verhindert Fehler beim Laden der Stylesheet.

Das obige ist der detaillierte Inhalt vonWie binde ich CSS-Dateien ordnungsgemäß in Node.js-, Express- und EJS-Projekte ein?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Neueste Artikel des Autors
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage
Über uns Haftungsausschluss Sitemap
Chinesische PHP-Website:Online-PHP-Schulung für das Gemeinwohl,Helfen Sie PHP-Lernenden, sich schnell weiterzuentwickeln!