Node-Express error: No default engine was specified and no extension was provided-CodePudding

I've just started learning Node.js and i'm trying to create a web application that returns the form in users.ejs when http://localhost:8083 is entered. What is going wrong here?

./index.js

var express = require("express");
var mysql=require("mysql");

var app = express();
 

var usersRouter=require('./routes/users');

app.use("/",usersRouter);
 
var server = app.listen(8083, function(){
    var port = server.address().port;
    console.log("Server started at http://localhost:%s", port);
});

./routes/users.js

var express=require("express");
var router=express.Router();

router.get('/',function(req,res){
    res.render("./views/users");
})

module.exports = router;

./views/users.ejs

<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1">
</head>
<body>
<div >
    <h2>Create User Data</h2>
    <form action="/users/create" method="POST">
          <label>Full Name</label>
          <input type="text" placeholder="Enter Full Name" name="fullName" required>
          <label>Email Address</label>
          <input type="email" placeholder="Enter Email Address" name="emailAddress" required>
          <label>City</label>
          <input type="city" placeholder="Enter Full City" name="city" required>
          <label>Country</label>
          <input type="text" placeholder="Enter Full Country" name="country" required>
          <button type="submit">Submit</button>
        </div>
</div>
</body>
</html>

CodePudding user response：

The view engine for rendering the template file is not configured.

You need to setup the view engine on the app level via app.set method, by setting view engine to ejs :

view engine

String The default engine extension to use when omitted. NOTE: Sub-apps will inherit the value of this setting.

https://expressjs.com/en/5x/api.html#app.settings.table

so in index.js add this:

app.set('view engine', 'ejs');

also, you need to install ejs

npm i -S ejs

and include it, so your index.js file should look like this

var ejs = require('ejs');

app.set("view engine", "ejs");

Now the view engine is set, but your users router will fail with this error:

Error: Failed to lookup view "./vies/users" in views directory

It's this method here:

res.render("./views/users");

It's now trying to load users template from views/views, i.e. there's an extra view. It's coming from yet another app setting - views, a directory to store and read view templates:

views

String or Array A directory or an array of directories for the application's views. If an array, the views are looked up in the order they occur in the array

Default: process.cwd() '/views'

https://expressjs.com/en/5x/api.html#app.settings.table

It's configured by setting the views path on the app level, like so:

app.set('views', path.join(__dirname, 'views'));

And as you can see, it's already set to process.cwd() '/views' by default, so it's optional, which means that's where that extra view is coming from, so you just need to remove views/ in the users router, so it'll pick it up from the root by default:

res.render("./users");

Final code:

./index.js

var express = require("express");

var app = express();

// load ejs template renderer
var ejs = require("ejs");

// register the given template engine 
app.set("view engine', 'ejs");


// optional, as it defaults to process.cwd()   '/views'
// needs path too:
// var path = require("path");
//app.set("views", path.join(__dirname, "views"));


var usersRouter = require("./routes/users");

app.use("/", usersRouter);

var server = app.listen(8083, function() {
    var port = server.address().port;
    console.log("Server started at http://localhost:%s", port);
});

./routes/users.js

var express=require("express");
var router=express.Router();

router.get('/',function(req,res){
    res.render("./users");
})

module.exports = router;

Check Express guide and examples here:

https://expressjs.com/en/starter/examples.html