Question

我正在学习节点并使用expressjs，问题是css文件只在主页面上工作，而下面的任何其他页面都不是应用程序的代码：

var express = require("express");
var app = express();

// assets
 app.use(express.static("public"));

// simple file testing
app.get("/anything/:stuff", function(req, res){
var stuff = req.params.stuff;
res.render("love.ejs", {stuff: stuff});
});

// posts page
var books = [
{title:"Harry Potter",author:"JK Rowling",editions:7},
{title:"Peere Kamil",author:"Humaira Saeed",editions:4},
{title:"Mushaf",author:"Abdullah khan",editions:2}
];

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

app.listen(3000, process.env.IP, function(){
console.log("Serving Now!");
});

以下是无效的页面代码。

    <!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="app.css" />
<title>demo app</title>
</head>
<body>

<h1>You fell in love with : <%= stuff %> </h1>

<%
if(stuff.toUpperCase() === "WAQAS"){ %>
    <P>GOOD CHOICE HE IS THE BEST</p>
<% } %>



<p>P.S This is the love.ejs file</p>
</body>
</html>

该文件位于公共目录下。

Answer 1

使用CSS文件的绝对URL，因此浏览器不会相对于当前URL查找它：

<link rel="stylesheet" href="/app.css" />

说明：假设您在浏览器中打开了网址/anything/helloworld。如果您的HTML只包含app.css，而前面没有前导斜杠，浏览器将尝试加载/anything/app.css（因为没有相对于当前网址的斜线），这并不指向你的CSS文件。

当您添加前导斜杠时，express.static将能够在public/中找到CSS文件。

Express仅在主页面中提供css文件

1 个答案: