The app runs for shop and admin routes but doesn't work for error route.Error routes was also in MVC format but i tested it without the architecture also.
Below is the snippet of app.js from root directory.
const path = require('path');
const express = require('express');
const bodyParser = require('body-parser');
const errorController = require('./controllers/error');
const app = express();
app.set('view engine', 'ejs');
app.set('views', 'views');
const adminRoutes = require('./routes/admin');
const shopRoutes = require('./routes/shop');
app.use(bodyParser.urlencoded({ extended: false }));
app.use(express.static(path.join(__dirname, 'public')));
app.use('/admin', adminRoutes);
app.use(shopRoutes);
app.use((req, res, next) => {
res.status(404).render('404', { pageTitle: 'Page Not Found' });
});
app.listen(3000);
And the 404 EJS code is
<%- include('includes/head.ejs') %>
</head>
<body>
<%- include('includes/navigation.ejs') %>
<h1>Page Not Found!</h1>
<%- include('includes/end.ejs') %>
And, Navigation.ejs is
<header class="main-header">
<nav class="main-header__nav">
<ul class="main-header__item-list">
<li class="main-header__item">
<a class="<%= path === '/' ? 'active' : '' %>" href="/">Shop</a>
</li>
<li class="main-header__item">
<a class="<%= path === '/admin/add-product' ? 'active' : '' %>" href="/admin/add-product">Add Product</a>
</li>
</ul>
</nav>
</header>
It shows the following error:
ReferenceError: C:\Users\Najus\Desktop\New folder\views\404.ejs:5
3|
4| <body>
>> 5| <%- include('includes/navigation.ejs') %>
6| <h1>Page Not Found!</h1>
7|
8| <%- include('includes/end.ejs') %>
C:\Users\Najus\Desktop\New folder\views\includes\navigation.ejs:6
4| <ul class="main-header__item-list">
5| <li class="main-header__item">
>> 6| <a class="<%= path === '/' ? 'active' : '' %>" href="/">Shop</a>
7| </li>
8| <li class="main-header__item">
9| <a class="<%= path === '/admin/add-product' ? 'active' : '' %>" href="/admin/add-product">Add Product</a>
path is not defined
at eval (eval at compile (C:\Users\Najus\Desktop\New folder\node_modules\ejs\lib\ejs.js:618:12), <anonymous>:11:26)
at returnedFn (C:\Users\Najus\Desktop\New folder\node_modules\ejs\lib\ejs.js:653:17)
at include (C:\Users\Najus\Desktop\New folder\node_modules\ejs\lib\ejs.js:651:39)
at eval (eval at compile (C:\Users\Najus\Desktop\New folder\node_modules\ejs\lib\ejs.js:618:12), <anonymous>:12:17)
at returnedFn (C:\Users\Najus\Desktop\New folder\node_modules\ejs\lib\ejs.js:653:17)
at tryHandleCache (C:\Users\Najus\Desktop\New folder\node_modules\ejs\lib\ejs.js:251:36)
at View.exports.renderFile [as engine] (C:\Users\Najus\Desktop\New folder\node_modules\ejs\lib\ejs.js:482:10)
at View.render (C:\Users\Najus\Desktop\New folder\node_modules\express\lib\view.js:135:8)
at tryRender (C:\Users\Najus\Desktop\New folder\node_modules\express\lib\application.js:640:10)
at Function.render (C:\Users\Najus\Desktop\New folder\node_modules\express\lib\application.js:592:3)
I have tried back and forth various ways looking up the internet and couldn't find the way to tweak the code.
reason is that path is undefined so in the navigation.ejs can't find path's value so to solve it you should add it in the render function
shortly, try adding in the 'path' parameter in the function render here:
res.status(404).render('404', { pageTitle: 'Page Not Found' });
to become like this
res.status(404).render('404', { pageTitle: 'Page Not Found', path: 'Error'});
that should make it work!
The solution provided by Ahmed Mokhtar is correct. I would like to describe a bit. actually for 404 ejs file when it is going to navigation.ejs, it is finding for "path". But as you haven't provided any object property as path to your 404 ejs it is throwing that not defined error, as path is not known to navigation ejs for 404 ejs
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With