Когда я посещаю другую страницу, изображения, логотипы и значки не отображаются, но когда я возвращаюсь на домашнюю страницу, изображения отображаются идеально

В этом проекте я использовал механизм шаблонов pug и express.js

Ниже по ссылке находится изображение папки и файлов проекта

Изображение папки и файлов проекта

Ниже по ссылке приведено изображение домашней страницы

изображения, логотипы и значки отображаются идеально, но на странице входа и регистрации я столкнулся с проблемой с изображениями

Домашняя страница

Ниже по ссылке приведено изображение страницы входа и регистрации

На этой странице изображения не отображаются Проблема!

страница входа и регистрации

Ниже приведен раздел express.js код

 const express = require("express"); const app = express(); const port = 80; const path = require('path');  // lt;------------------ define static mode ------------------gt;  *// app.use(express.static('public'));*  const staticpath = path.join(__dirname, '../public'); app.use(express.static(staticpath));  // lt;------------------ Adding pug engine in express ------------------gt; app.set('view engine', 'pug'); app.set('views', path.join(__dirname, '../view'));  app.get('/', (req, res)=gt;{  res.status(200).render('index.pug'); })  app.get('/loginandsingup.pug', (req, res)=gt;{  res.status(200).render('loginandsingup.pug'); })  app.listen(port, ()=gt;{  console.log(`application had started successfully on port ${port}`) })  

ниже приведен раздел с кодом домашней страницы мопса

 .img#menu-icon  img(src="images/menu-icon.svg", alt="Menu icon") #navbarSupportedContent.collapse.navbar-collapse  .logo  a(href="/")  img(src="images/logo.png", alt="entre logo")  ul.navUl.navbar-nav.mb-2.mb-lg-0  li#nav-item-1.navList.nav-item  a.navLink.nav-link.text-dark(href="#") Home  li#nav-item-1.navList.nav-item  a.navLink.nav-link.text-dark(href="#") Order  

Ниже приведен раздел с кодом входа в систему и страницы входа в систему

 .img#menu-icon  img(src="./menu-icon.svg", alt="Menu icon")  #navbarSupportedContent.collapse.navbar-collapse  .logo  a(href="/")  img(src="./logo.png" alt="entre logo")  ul.navUl.navbar-nav.mb-2.mb-lg-0  li#nav-item-1.navList.nav-item  a.navLink.nav-link.text-dark(href="#") Home  li#nav-item-1.navList.nav-item  a.navLink.nav-link.text-dark(href="#") Order  

Есть ли решение этой проблемы?

1. Добавьте это промежуточное программное обеспечение в указанный app.js выше механизм просмотра

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

2. Структура Папок

 |__public/   |__ css/  |__ css files...  |__ js/  |__ js files...  

3. Импортируйте таким образом

Теперь вы задаете путь к общедоступному каталогу, который вы должны указать в общей папке при импорте

 lt;link rel="stylesheet" href="/css/main.css" /gt;  

записка:-

Еще одна вещь общий каталог в корневом каталоге, а также app.js файл должны быть в корневом каталоге, если вы хотите app.js в src, затем установите соответствующий путь

Теперь вы должны быть полностью настроены для доступа к CSS или любому файлу