CODEWITHSUNDEEP
javascriptnode.jsexpressejs
TGW
TGW

Reputation: 835

EJS Could not find include include file

This might sound like duplicate of this and few others but the solutions given in those stack were not helpful.

I am creating an HTML using EJS templating, but while including a partial I am receiving following error : 

 throw new Error('Could not find include include file.');

Below is the project structure 

 |
 |
 |-----index.js
 |-----view
 |       |
 |       |----pages
 |       |      |----mainTemplate.ejs
 |       |----partials
 |       |      |----bodyTemplate.ejs
 |       |

Now as per doc the include takes relative path so code in my mainTemplate.ejs includes the bodyTemplate like this

<!DOCTYPE html>
<html lang="en">
<head>
    <title>Sample</title>
</head>

<body>

<!-- Insert Body here -->
<div class="container">

    <div class="starter-template">
        <% include ../partials/bodyTemplate.ejs%>
    </div>

</div>

</body>
</html>

While code in bodyTemlate.ejs is 

<% console.log("#########################");%>
<h1>Hi there !! </h1>

I am receiving Could not find include include file This error is not much specific as to which path is being accessed here.

I have tried removing .. from the path still no use? I have same project structure in my EJS application and this same code snippet works just fine? Is this something specific to express causing such issue?

EDIT

This is index.js

var fs = require('fs'),
  ejs = require("ejs");

function ejs2html(path, information) {
  fs.readFile(path, 'utf8', function(err, data) {
    if (err) {
      console.log("ERROR: " + err);
      return false;
    }
    var ejs_string = data,
      template = ejs.compile(ejs_string),
      html = template(information);
    fs.writeFile(path + '.html', html, function(err) {
      if (err) {
        console.log(err);
        return false
      }
      return true;
    });
  });
}
// console.log("This is path --> ", __dirname + '/view/pages/bodyTemplate.ejs');
ejs2html(__dirname + '/view/pages/mainTemplate.ejs');

Upvotes: 2

Views: 5422

Answers (1)

Alex Michailidis
Alex Michailidis

Reputation: 4143

The problem was that you are trying to compile the html after you got it as a string from fs that way ejs has no idea where that file located and where to look for relative templates.

var fs = require('fs'),
    ejs = require("ejs");

function ejs2html(path, information) {
    fs.readFile(path, 'utf8', function (err, data) {
        if (err) {
            console.log("ERROR: " + err);
            return false;
        }
        var ejs_string = data,
            template = ejs.compile(ejs_string, {
                filename: path
            }),
            html = template(information);
        fs.writeFile(path + '.html', html, function (err) {
            if (err) {
                console.log(err);
                return false
            }
            return true;
        });
    });
}
// console.log("This is path --> ", __dirname + '/view/pages/bodyTemplate.ejs');
ejs2html(__dirname + '/view/pages/mainTemplate.ejs');

Basically, I pass {filename: path} in order to tell ejs where the file is originally located.

Although I believe the thing you are trying to do, ejs has already implemented it with the renderFile method. Check this alternate function that will do what you want.

var fs = require('fs'),
    ejs = require("ejs");

function ejs2html2(path, information) {
    ejs.renderFile(path, function (err, html) {
        if (err) {
            console.log("ERROR: " + err);
            return false;
        }
        fs.writeFile(path + '.html', html, function (err) {
            if (err) {
                console.log(err);
                return false
            }
            return true;
        });
    })
}
ejs2html2(__dirname + '/view/pages/mainTemplate.ejs');

Upvotes: 11

Related Questions