CODEWITHSUNDEEP
javascriptnode.jsexpressejsnode-modules
user3005775
user3005775

Reputation: 306

nodejs/ejs syntax error with include partials

I have a really strange problem which I cannot figure out

i get this error when trying to load the webpage. I am trying to very simply do views with partials for header and footer. I have tried every which way of doing it even starting a new project doing npm init, npm install express ejs

SyntaxError: missing ) after argument list in layout.ejs while compiling ejs

If the above error is not helpful, you may want to try EJS-Lint:
https://github.com/RyanZim/EJS-Lint
Or, if you meant to create an async function, pass `async: true` as an option.
at new Function (<anonymous>)
at Template.compile (\node_modules\ejs\lib\ejs.js:626:12)
at Object.compile (\node_modules\ejs\lib\ejs.js:366:16)
at handleCache (\node_modules\ejs\lib\ejs.js:215:18)
at tryHandleCache (\node_modules\ejs\lib\ejs.js:254:16)
at View.exports.renderFile [as engine] (\node_modules\ejs\lib\ejs.js:459:10)
at View.render (\node_modules\express\lib\view.js:135:8)
at tryRender (\node_modules\express\lib\application.js:640:10)
at Function.render (\node_modules\express\lib\application.js:592:3)
at ServerResponse.render (\temp\node_modules\express\lib\response.js:1012:7)

here is my main.js code located in the root

express = require("express");
layouts = require("express-ejs-layouts");
app = express();
app.set("port",process.env.PORT || 3000);
app.set("view engine", "ejs");
const homeController = require("./controllers/homeController");
app.use(layouts);
app.get("/users/:userName", homeController.respondWithuName);
app.listen(app.get("port"), () => {
    console.log(`Server is running on blah blah port: ${app.get("port")}`);
});

here is my index.ejs located in /views

<h1> Hello, <%= uname %></h1>

here is my layout.ejs also located in /views

<body>
<%- include partials/header.ejs %>
<%- body %>
<%- include partials/footer.ejs %>
</body>

my header and footer ejs files are located in /views/partials and are basically just divs for now with their respective ids.

here is my package.json located in the root which shows I have all the correct dependencies installed

 {
"name": "test",
"version": "1.0.0",
"description": "test",
"main": "main.js",
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1"
},
"repository": {
"type": "git",
"url": "test"
},
"author": "test",
"license": "ISC",
"dependencies": {
"ejs": "^3.0.1",
"express": "^4.17.1",
"express-ejs-layouts": "^2.5.0"
}
}

The error does not occur if I do not use the includes for header and footer in layout

So either I did something wrong, or there is a problem with includes on ejs.

Upvotes: 1

Views: 6693

Answers (2)

matijaosojnik
matijaosojnik

Reputation: 121

You have to put the partials in brackets and quotes. So you should write this part

    <body>
    <%- include partials/header.ejs %>
    <%- body %>
    <%- include partials/footer.ejs %>
    </body>

Like this

    <body>
    <%- include ("partials/header") %>
    <%- body %>
    <%- include ("partials/footer") %>
    </body>

Upvotes: 12

user3005775
user3005775

Reputation: 306

so in case anyone else runs into this issue using ejs. Apparently include is considered a function and thus requires ()

so proper syntax would be

 <% include('somefile') %>

even though this is not specified in the documentation which calls it a keyword and not a function.

Welp thats it, answered my own question thanks to @Saurabh

Upvotes: -1

Related Questions