图像无法在 header.ejs 文件中显示

时间:2021-07-16 17:03:50

标签: javascript html css express

我正在制作一个网站,我认为拥有一个 jvascript http 标头(通过 express)会很酷,所以我不必在每个文件上创建一个页眉和一个页脚。好的,我做到了(Yayyy)但我必须在标题中插入一个标志(jpeg),我不能,因为有些不对......但我不知道什么。

我的 header.ejs 文件

<!DOCTYPE html>
    <html>
        <head>
            <meta charset="UTF-8">
            <meta name="viewport" content="width=device-width, initial-scale">

            <title>Document</title>

            <link  rel="stylesheet" href="css/Header.css">
        </head>
        <body>
            <div id="Header">
                <div id="upper-Header">
                    <img src="../public/img/upper-header.jpg"/>
                </div>
                <div id="lower-Header">
                
                </div>
            </div>
        </body>
    </html>

我的 app.js 文件

const express = require('express');
const app = express();
const port = 3000;


app.use(express.static("./src/public"));
app.use("/css/", express.static(__dirname  + "public/css/"));
app.use("/img/", express.static(__dirname  + "public/img/"));
app.use("/js/", express.static(__dirname  + "public/js/"));


app.set("views", "./src/views");
app.set("view engine", "ejs")

app.get("", (req, res) => {
    res.render("Header", { text: "This is ejs"});
})


app.listen(port, () => {
    console.log(`Listening for port: ${port}`);
});


node_modules
src
   public
       css
         Header.css
         Footer.css
      img
         upper-header.jpg
      js
         Footer.js
         Header.js
  views
     Header.ejs
     Footer.ejs
app.js
package-lock.json
package.json```

1 个答案:

答案 0 :(得分:0)

图像的名称是 upper-Header.jpg,而您在 ejs 文件中已将其设置为 upper-header.jpg。更正名称后尝试。

相关问题