Rumah > Artikel > hujung hadapan web > HTML tidak memaparkan css dalam nodejs
HTML tidak memaparkan css dalam nodejs
- WBOYasal
- 2023-05-17 12:22:07738semak imbas
Dalam proses membangunkan menggunakan Node.js, kadangkala kami menghadapi masalah bahawa gaya CSS dalam html tidak dapat dipaparkan dengan betul. Masalah ini biasanya berlaku kerana kami tidak memperkenalkan fail CSS dengan betul atau kerana tetapan lalai Node.js menyebabkan masalah. Artikel ini akan memperkenalkan dan menganalisis masalah ini dan memberi penyelesaian.
1. Analisis Masalah
Dalam pembangunan Node.js, kami biasanya menggunakan rangka kerja Express untuk membina pelayan dan menggunakan EJS atau enjin templat lain untuk memaparkan halaman. Apabila memaparkan halaman, kami sering memperkenalkan fail CSS melalui teg pautan Kod sampel adalah seperti berikut:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Node.js</title>
<link rel="stylesheet" href="styles.css">
</head>
<body>
<h1>Hello Node.js!</h1>
</body>
</html>Walau bagaimanapun, apabila kami membuka halaman dalam penyemak imbas, kami mendapati bahawa fail CSS kelihatan tidak. dimuatkan, mengakibatkan Halaman tidak mempunyai gaya, seperti yang ditunjukkan di bawah:
Pada masa ini, kita perlu menganalisis punca masalah.
2. Penyelesaian
Selepas analisis, biasanya terdapat dua sebab untuk masalah ini:
- Ralat laluan fail CSS
Dalam kod contoh di atas, apabila kami memperkenalkan fail CSS, kami menggunakan laluan relatif kepada halaman semasa, seperti styles.css. Jika kami meletakkan fail dalam direktori pada tahap yang sama dengan halaman semasa, laluannya mestilah betul. Walau bagaimanapun, jika kami meletakkan fail dalam direktori lain, laluan itu perlu diubah suai. Sebagai contoh, jika kita meletakkan fail dalam direktori lain myStyles/ daripada halaman semasa, laluan yang betul hendaklah: href="myStyles/styles.css".
- Masalah yang disebabkan oleh tetapan lalai Node.js
Dalam tetapan lalai Node.js, rangka kerja Express akan menggunakan folder awam sebagai direktori fail statik , dan tetapan lalai Format .css, .js, .jpg, .png dan fail lain ialah fail statik. Ini bermakna jika kita ingin merujuk fail CSS dalam fail html, kita perlu menyimpan fail CSS dalam folder awam. Contohnya, dalam kod sampel di atas, fail CSS kami disimpan dalam gaya/ subdirektori direktori awam Kami perlu mengubah suai teg pautan kepada:
<link rel="stylesheet" href="/styles/styles.css">
Dengan cara ini, fail CSS boleh diimport. biasalah.
3. Ringkasan
Melalui pengenalan dan analisis di atas, kita dapati bahawa apabila membangun dengan Node.js, adalah sangat penting untuk memperkenalkan fail CSS dengan betul. Jika pengenalan tidak berjaya, halaman akan kekurangan gaya dan menjejaskan pengalaman pengguna. Dengan menguasai kaedah pengenalan yang betul, kami boleh membangunkan tapak web dan aplikasi berkualiti tinggi dengan lebih baik.
Atas ialah kandungan terperinci HTML tidak memaparkan css dalam nodejs. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!