javascript - 不使用模板引擎时如何在 Express.js View 中包含 CSS 文件？

我正在尝试创建一个 Express 应用程序。我的限制是我不能使用任何模板引擎来渲染 HTML。 (至少)有两个问题:

我预见的问题之一是如何根据需要向用户显示的内容来操纵数据。例如。我的数据库中有一个交易表，我需要显示所有这些交易的 HTML 表。我使用的传统方法是利用模板引擎，我可以在其中放置一个遍历记录的 for 循环。
当我调用特定路由时，我正在发送 HTML 文件，但它无法从其他文件夹获取 CSS 文件。

对于问题2。我尝试过:

 app.get('/transactions', (req, res) =>
    res.sendFile(path.join(__dirname+'/public/assets/html/transactions.html')))

然后在 transactions.html 中我有

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

以及样式表的其他链接。

当页面显示时，它不会应用任何样式。当我在浏览器中检查源代码并单击constants.css 的链接时，它会显示以下消息:

Cannot GET /stylesheets/shared/constants.css

这似乎不是正确的逻辑。哪些事情应该改变？

最佳答案

简单的例子:

假设您的文件夹结构:

app.js
|   +-- public
|   |   +-- stylesheets
|   |   |   +-- shared
|   |   |   |   +-- constants.css
...

您可以简单地将公共(public)文件夹作为静态服务器，例如:

app.use(express.static(__dirname + "/public"))

// In your html
<link rel="stylesheet" href="/stylesheets/shared/constants.css">

对于express，最好使用绝对路径而不是相对路径。

或者为静态文件设置虚拟路径，例如:

app.use('/static', express.static(__dirname + "/public"))

// In your html
<link rel="stylesheet" href="/static/stylesheets/shared/constants.css">

关于javascript - 不使用模板引擎时如何在 Express.js View 中包含 CSS 文件？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/55767775/