路由参数导致在使用Node.js和Express时不加载CSS

我正在使用Node.js、Express和EJS模板引擎构建一个简单的网站，但我很难将外部CSS文件加载到具有路由参数的路由上。我的代码如下所示：

const express = require("express");
const app = express();
var AWS = require('aws-sdk');
var uuid = require('uuid');
var request = require('request');
var Amplify = require('aws-amplify');
const { info } = require("console");

app.use(express.static("public"));
app.set("view engine", "ejs");

app.get("/Test1/", function(req, res){
res.render("Test1.ejs");
});

app.get("/Test2/:route", function(req, res){
res.render("Test2.ejs")
});

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

Test1.ejs和Test2.ejs彼此完全相同，一个是从另一个复制粘贴的

我能够看到CSS文件在Test1上正确加载，但在Test2上，express发送的是Test2.ejs的HTML，而不是实际的CSS文件。这是没有重新加载或更改任何内容。如果CSS没有正确加载到我的任何路由上，我就不会那么困惑了，因为这表明我在使用express时遇到了一些问题，但我不知道它如何在所有其他路由上正常工作，并且在使用路由参数时失败。我还尝试实际使用route参数，例如

app.get("/Test2/:route", function(req, res){
const routeParam = req.params.route;
res.render("Test2.ejs", {
    routeParam: routeParam
});

}))`

我还在页面中显示了routeParam，以确保它正常工作，但页面仍在使用页面的HTML替换正确的CSS文件，导致其格式不正确

---

我非常感谢您在这方面的任何帮助，谢谢您

我真的无法复制这个。我正在做的是：

将我的CSS放置在

public/CSS/all.CSS

中。文件只包含一行：

html{background color:#aaaaaa}

，所以我可以判断它已加载

将两个模板放入

视图/Test1.ejs

和

视图/Test2.ejs

中，并将相同的内容放入其中：

而且它工作得很好

我假设您已经在

public/

文件夹中创建了一个文件夹

Test2

，您将CSS放在该文件夹中。在这种情况下，CSS的路径是

/Test2/some.CSS

与第二条路径匹配，而不是获取CSS文件，而是从该路径获取HTML

---

在这种情况下，移动CSS文件会有所帮助。

感谢您查看此CoderFF，您帮助我找到了如何使其工作的方法。看起来问题在于我的css文件直接在公共文件夹中，而不是在它的子目录中。html必须如下所示：

const express = require("express");
const app = express();
var AWS = require('aws-sdk');
var uuid = require('uuid');
var request = require('request');
var Amplify = require('aws-amplify');
const { info } = require("console");

app.use(express.static("public"));
app.set("view engine", "ejs");

app.get("/Test1/", function(req, res){
res.render("Test1.ejs");
});

app.get("/Test2/:route", function(req, res){
res.render("Test2.ejs")
});

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

---

它必须在href标签中包含前导“/”。如果没有它，我不知道在没有路线参数的路线上它是如何工作的，但它确实是。这似乎同样适用于公用文件夹中/images/文件夹中的图像。

谢谢查看，但我仍然有这个问题。Test1.ejs和Test2.ejs已经从同一个CSS文件（customStyle.CSS在“public”文件夹中）中提取。我也在一个新项目中重新创建了这个问题。我不知道出了什么问题，test1.ejs和test2.ejs中的css行看起来像是我把代码推到了GitHub。请尝试签出：。不要忘记运行

npm安装