拒绝应用"http://localhost:2000/cssFile/style.css"中的样式,因为它的MIME类型("文本/html")



我目前正试图将我的style.css文件添加到home。express.js渲染的Ejs文件

但是我一直收到以下错误

Refused to apply style from 'http://localhost:2000/cssFile/style.css' because its MIME type ('text/html') is not a supported stylesheet MIME type, and strict MIME checking is enabled.

我的文件结构像

cssFile
| style.css
views
| htmlFile
|   | home.ejs
index.js

这是我的快递码

const express = require("express");
const app = express();
const path = require("path");
const mongoose = require("mongoose");
const Comments = require("./models/comments");
app.use(express.static(__dirname + "/public"));
app.set("views", path.join(__dirname, "views"));
app.set("view engine", "ejs");
app.get("/", (req, res) => {
res.render("htmlFile/home");
});

我home.ejs:

...
<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" />
<title>Document</title>
<link
href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/css/bootstrap.min.css"
rel="stylesheet"
integrity="sha384-EVSTQN3/azprG1Anm3QDgpJLIm9Nao0Yz1ztcQTwFspd3yD65VohhpuuCOmLASjC"
crossorigin="anonymous"
/>
//buggy code
<link rel="stylesheet" type="text/css" href="/cssFile/style.css" />
</head>

我一直在尝试另一种解决方法,但就是解决不了我的。

我的文件结构如下

cssFile
| style.css
views
| htmlFile
|   | home.ejs
index.js

这是我的快递码

... (all your other code)
app.use(express.static(__dirname + "/public"));

在这段JavaScript代码中,你告诉express。Static表示您正在尝试从名为"public"的目录中提供静态文件,该目录不存在。如果你看一下"网络"面板,你可能会看到你得到一个404页面,或者有时是一个不同的HTML文件。

试着把你的文件结构改成这样:

public
| cssFile
|  | style.css
views
| htmlFile
|   | home.ejs
index.js

相关内容