包括node.js + express + js上的css和js文件

Including css and js files on node.js + express + ejs

本文关键字：js css 文件 express node 包括 上的      更新时间：2023-09-26

我试图在我的node.js项目中使用样式表和javascript文件，该项目使用express和ejs。

我结构:

public/
  -- css/
  -- js/
  -- images/

和我的聊天。ejs文件:

<!DOCTYPE html>
<html lang="en">
<head>
    <% include ../partials/head %>
</head>
<body>
.. content ..
    <% include ../partials/footer %>
</body>
</html>

和my partials/head。Ejs有代码

<link href="public/css/custom.css" rel="stylesheet">

它应该加载样式文件，但它没有。我的main chat.js:

    var express = require('express');
var app = express();
// set the view engine to ejs
app.set('view engine', 'ejs');
app.use(express.static(__dirname + '/public'));
// index page
app.get('/', function(req, res) {
    res.render('pages/chat');
});
app.listen(3000, function(){
    console.log('listening on *:3000');
});

那么如何正确使用呢?

public文件夹实际上不会是客户端可用的URL路径的一部分:

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

您提供给express.static()的路径将与URL路径组合，效果为:

// GET /css/custom.css
(__dirname + '/public') + '/css/custom.css'

因此，当请求public/css/custom.css时，express.static()将尝试查找:

// GET /public/css/custom.css
(__dirname + '/public') + '/public/css/custom.css'

期望文件夹结构改为:

public/
  -- public/
      -- css/
      -- js/
      -- images/
相关文章：