Question

CSS文件未加载，并且正在检查element（F12）并转到Networks，我的CSS文件不可见。我已经添加了中间件

app.use(express.static(path.join(__dirname, '/public')));

以及上方的必填路径。

我添加了中间件，需要它，npm也安装了它。

我的文件夹结构

-app.js

-package.json

-package-lock.json

-node_modules

-public

    -stylesheets

        -main.css

-views

    -index.ejs

    -partials

        -header.ejs

        -footer.ejs

我的Header.ejs文件具有此文件，并且我的正文中包含一些文本。

<link href="/stylesheets/main.css"> 我的app.js文件是

var express = require('express');
var request = require('request');
var ejs = require('ejs');
var path = require('path');
var app = express();
app.set('view engine', 'ejs');
app.use(express.static(path.join(__dirname, '/public')));

我的css文件更改了backgorund的颜色，index.ejs文件分别调用了页眉和页脚

<% include partials/header%>

我的CSS代码

body{
background-color: purple;
text-align: center;
}

我的Chrome控制台未显示任何错误，但仍然无法上传CSS。预先感谢您的输入。

Answer 1

您使用的链接标记错误。您需要为其提供rel和type属性，以便加载CSS并正确解析它。查看link标签的文档以了解更多信息

Answer 2

问题出在链接标记上。您必须在链接标记中指定 rel ，类型和 href 属性。

<link rel = "stylesheet" type = "text/css" href = "/stylesheets/main.css" />

Answer 3

问题是给您的样式表文件是一个给定的URL，该URL将由导航器使用当前根路径来完成。例如，这是您的下面链接。

<link rel="stylesheet" href = "/stylesheets/main.css" />

这是您的NodeJS服务器代码。

app.get("/your/root/path", (req, res)=>{

})

您的href链接将对应于/your/root/path/stylesheets/main.css 我认为这将是您的问题。如果是这样，请进行更正，请为静态文件设置<base>网址，或者不要让返回视图的路由路径以/your/root/path的形式而是以/your-root-path

的形式出现

添加中间件后CSS文件也无法加载

3 个答案: