CODEWITHSUNDEEP
javascripthtmlnode.jsejs
Pravesh Rana
Pravesh Rana

Reputation: 1

Using ejs with express returns unexpected token < used

this is my first try at using Ejs, i think i got all my syntax right. cant understand whats wrong

const express = require("express");
const bodyParser = require("body-parser");
const ejs = require("ejs");

const app = express();
app.set('view engine', 'ejs');
app.use(bodyParser.urlencoded({extended:true}));
let today = new Date();
let options = {
  weekday: "long",
  year: "numeric",
  month: "long",
  day: "numeric"
};

let day = today.toLocaleDateString("en-US", options);
let todoList = ["Sleep","Eat","?"];
app.get("/", function(req, res){
 res.render("index", {
   day: day,
   todoList: todoList
 } );
});
app.post("/", function(req, res){
  let newInput = req.body.todoInput;
  todoList.push(newInput);
});

app.listen(3000, function(){
  console.log("Server started on port 3000.");
});

my ejs

<!DOCTYPE html>
<html lang="en" dir="ltr">

<head>
  <meta charset="utf-8">
  <title>Ra's To-do List</title>
</head>

<body>
  <p>
    <%= day %> : Today's to-do list</p>
  <ul>
     <% for (var i=0, i< todoList.length, i++) { %>
    <li> <%= todoList[i] %> </li>
    <% } %>
  </ul>
  <form action="/" method="post">
    <input type="text" name="todoInput" placeholder="Add to your to-do list here">
    <button type="submit" name="button">Add stuff to-do</button>
  </form>
</body>

</html>

Im using WSL and have installed all the modules properly. it gives the unexpected token < in .... while compiling ejs. ive been at this for a couple of hours now and i might break my laptop soon :)

SyntaxError: Unexpected token < in /mnt/c/Users/PraveshRana/Desktop/webDev/ejs-todo/views/index.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 () at Template.compile (/mnt/c/Users/PraveshRana/Desktop/webDev/ejs-todo/node_modules/ejs/lib/ejs.js:618:12) at Object.compile (/mnt/c/Users/PraveshRana/Desktop/webDev/ejs-todo/node_modules/ejs/lib/ejs.js:389:16) at handleCache (/mnt/c/Users/PraveshRana/Desktop/webDev/ejs-todo/node_modules/ejs/lib/ejs.js:212:18) at tryHandleCache (/mnt/c/Users/PraveshRana/Desktop/webDev/ejs-todo/node_modules/ejs/lib/ejs.js:251:16) at View.exports.renderFile [as engine] (/mnt/c/Users/PraveshRana/Desktop/webDev/ejs-todo/node_modules/ejs/lib/ejs.js:482:10) at View.render (/mnt/c/Users/PraveshRana/Desktop/webDev/ejs-todo/node_modules/express/lib/view.js:135:8) at tryRender (/mnt/c/Users/PraveshRana/Desktop/webDev/ejs-todo/node_modules/express/lib/application.js:640:10) at Function.render (/mnt/c/Users/PraveshRana/Desktop/webDev/ejs-todo/node_modules/express/lib/application.js:592:3) at ServerResponse.render (/mnt/c/Users/PraveshRana/Desktop/webDev/ejs-todo/node_modules/express/lib/response.js:1008:7)

Upvotes: 0

Views: 13584

Answers (4)

vanduc1102
vanduc1102

Reputation: 6255

In my case, it's because of long string get break, when I use a HTML formatter

<td style="padding-left: 1rem">
    <%= dateFns.format(new Date(date), 'long string format date' ) %>
</td>

when formatter is applied

<td style="padding-left: 1rem">
    <%= dateFns.format(new Date(date), 'long string 
format date' ) %>
</td>

my solution is to have a variable for the date format string

DATE_FORMAT = 'long string format date'
ejs.render('template.html', {...data, DATE_FORMAT})


<td style="padding-left: 1rem">
    <%= dateFns.format(new Date(date),DATE_FORMAT  ) %>
</td>

Upvotes: 0

hamid-davodi
hamid-davodi

Reputation: 1984

I had the same (similar) error in my node-ejs app (SyntaxError: Unexpected token ; ...). I think general answer for this error is to check your ejs code carefully. Usually there is a syntax error in your codes. For me, I noticed that when I used ejs variables in my code (for example <%= email %> that email is a variable), I used the wrong syntax like this:

<% email =%>

And after correcting that, the error disappeared. The text shown in this error is somehow illusory in my opinion. The problem actually is not related to async function and usually the character mentioned in token < or token ; or ... is not related to the real syntax error.

Upvotes: 0

Tolgahanbora
Tolgahanbora

Reputation: 1

Problem is, "<" less than symbol. Because you can not use on html. You should change html entity, like "& lt;"(delete one space char). And check it google another html entity symbol. Good luck.

Upvotes: 0

Aidan Sawers
Aidan Sawers

Reputation: 11

I think the problem is just that you are using commas instead of semi-colons in your ejs statement.

So instead of:

<% for (var i=0, i< todoList.length, i++) { %>

It should be:

<% for (var i=0; i< todoList.length; i++) { %>

Cheers, Aidan.

Upvotes: 1

Related Questions