Images not showing in pug template

Question

I have put the images folder inside the views folder and added the relative path to the images but the images are not loading on the html page. I have tried multiple options like putting the folder outside views, giving absolute path but nothing worked. Can anyone please take a look and help me figure out what the error is? Screenshot of my directory structure

I have tried many options but nothing worked. Screenshot of webpage

1. Your code should be added as text. 2. How do you serve images? — Konrad, Jan 01 '23 at 19:24
I agree with @Konrad, it looks like the issue is when serving the images. — Mohammad Kurjieh, Jan 01 '23 at 19:34
Please provide enough code so others can better understand or reproduce the problem. — Community, Jan 01 '23 at 19:56

score 0 · Accepted Answer · answered Jan 05 '23 at 09:42

Static files are processed differently from other types of routes in an Express application. A Http path for static files such as abc.com/img/bg.jpg does not map to a file bg.jpg in the views folder. Where it maps to is specified by the express.static function. So, something like:

const express = require("express");
const app = express();
const path = require("path");
app.use(express.static(path.join(__dirname, "public"));

will map the Http path / for static files to the folder public in your application's launch folder.

See __dirname for more information on this parameter.

Images not showing in pug template

1 Answers1