當我轉到localhost:3000我的 css 作業時，但是當我轉到localhost:3000/r/test我的 css 時不起作用，我收到以下訊息：
Refused to apply style from 'http://localhost:3000/r/styles.css' because its MIME type ('text/html') is not a supported stylesheet MIME type, and strict MIME checking is enabled.
每當我有一條路徑長于一個子路徑的路徑時（我不確定這是否是正確的術語），我的 css 根本不起作用。例如，這些路線將起作用：
app.get('/', (req, res) => {
...
)
app.get('/cats', (req, res) => {
...
)
app.get('/dogs', (req, res) => {
...
)
但這些都行不通：
app.get('/cats/test', (req, res) => {
...
)
app.get('/dogs/blah', (req, res) => {
...
)
app.get('/hamster/foo', (req, res) => {
...
)
我的 index.js 檔案：
const express = require('express');
const path = require('path');
const axios = require('axios');
const app = express();
app.set('view engine', 'ejs');
app.set('views', path.join(__dirname '/views'));
app.use(express.static(path.join(__dirname, 'public')));
app.get('/', (req, res) => {
res.render('home');
});
app.get('/r/test', (req, res) => {
res.render('test');
});
app.listen(3000, () => {
console.log(`Listening at http://localhost:3000`);
});
我的 test.ejs 檔案：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="styles.css">
<title>Test</title>
</head>
<body>
<h1>Hi<h1>
</body>
</html>
我的專案結構是：
Project
|
-- public
| |
| --styles.css
|
-- views
| |
| -- home.ejs
| -- test.ejs
|
--index.js
uj5u.com熱心網友回復：
將CSS檔案中的公共目錄，并添加/在href類似的鏈接
<link rel="stylesheet" href="/styles.css">
現在localhost:3000/style.css無論您在頁面上的哪個位置，它都會請求每次
/ 指向根目錄
uj5u.com熱心網友回復：
最好有一個單獨的路徑來提供靜態檔案
將靜態路徑更改為
app.use('/static',express.static(path.join(__dirname, 'public')));
并在 ejs 檔案中將其用作
<link rel="stylesheet" href="/static/styles.css">
轉載請註明出處，本文鏈接：https://www.uj5u.com/net/343608.html
標籤：javascript html css 节点.js 表达
上一篇：錯誤：在快遞中間件中將標頭發送回客戶端后無法設定標頭
下一篇：'無法獲取/api/items'