Failed to lookup view folder ejs in Express - javascript

I am using Node.js framework Express with TypeScript. But when I set view engine and view folder it return error "Failed to lookup view \"notice\" in views directory \"/Users/hung/source/js/nodejs_example/views\"".
I do not know why the path to view folder has the "\" at the end. Here is my code
app.ts
app.set('views', path.join(__dirname, 'views'));
app.set('view engine', 'ejs');
controller.ts
async renderView(req: Request, res:Response, next:Function):Promise <void> {
res.render('notice');
}
Project folder structure
src
app.ts
views
notice.ejs
..

Related

hosting .ejs file and node js

How do you host multiple webpages with an extension file of .ejs? I have a login page coded in .ejs and I wanted to host it on node.js by using those .ejs file and other pages connected with the login page I have or rather I wanted the login.ejs file to run using node.js. Thank you very much
Put all your *.ejs files in views folder (recommended way) and then set them as views in express using following code
app.set('views', __dirname + '/views');
app.set('view engine', 'ejs');
Now you can start rendering them on the path you wanted like below
router.get('/foo', function(req, res) {
res.render('foo') // this renders /views/foo.ejs
}

javascript src file 404 (Not Found)

I am facing error "file not found" in an angular javascript. I am using Nodejs and express for server and angularjs in html5. AngularChart.html is in "public" folder in which I am trying to refer one javascript in one level up.
script type="text/javascript" src="../check.js"
It is giving me the error in console.
GET http://localhost:3000/check.js 404 (Not Found)
Here is my folder structure.
\myapp\public\AngularChart.html
\myapp\check.js
it works when in refer files folder down but nothing working in folder up. I suspect it may be because of the __dirname in app.js which is as below.
var express = require('express');
var app = express();
app.use(express.static(path.join(__dirname, 'public')));
app.set('views', path.join(__dirname, 'views'));
app.set('view engine', 'html');
Please help.
Thanks
Your chart.js should be public so add it inside the public directory otherwise it gives a 404 error (Not found) since it is not visible to the client.(browser)

how to use multiple view engine like ejs and jsx in node js?

I am using ejs and jsx both file as template in node.js project but I am unable to find any solution and get error like this:
my code where both view engine included given under:
//view engine setup
app.use(express.static(path.join(__dirname, 'public')));
app.set('views', path.join(__dirname, 'app/views'));
app.set('view engine', 'jsx');
var options = { beautify: true };
app.engine('jsx', require('express-react-views').createEngine(options));
var engines = require('consolidate');
app.engine('ejs', engines.ejs);
on execution i am getting error "Error: Failed to lookup view "login" in views directory"
while i have created both jsx file and ejs file in view directory but not rendering.Any one can give me solution?

Rendering folder contents like mod_autoindex with express and ejs in my node.js app

I have been using express and ejs to render raw html files in a /public folder.
For example, to render http://localhost:3000/index.html, I have:
var express = require('express');
var ejs = require('ejs');
app.engine('.html', ejs.__express);
app.set('views', __dirname + '/public');
app.set('view engine', 'html');
app.use(express.static(__dirname + './public'));
and can render files from /public:
% find public/
public/index.html
public/favicon.ico
public/stylesheets
public/stylesheets/style.css
public/images
public/images/banner.gif
I want to be able render a folder contents, like http://localhost:3000/images/, exactly like the Apache module mod_autoindex, a table of files as links showing the directory contents.
Is there a way to do this?
The answer is simple, just search the npm library.
https://www.npmjs.com/package/mod_autoindex will do the job.

"Error: Cannot find module html" when visiting HTML page

When I started my application, and visited localhost:8333 in my browser, it threw an error:
Error: Cannot find module 'html'
at Function.Module._resolveFilename (module.js:338:15)
at Function.Module._load (module.js:280:25)
at Module.require (module.js:364:17)
at require (module.js:380:17)
at new View (C:\Users\fr\node_modules\express\lib\view.js:42:49)
at Function.app.render (C:\Users\fr\node_modules\express\lib\application.js:483:12)
at ServerResponse.res.render (C:\Users\fr\node_modules\express\lib\response.js:755:7)
at allClients (C:\Users\fr\node_modules\apps\chat.js:13:7)
at callbacks (C:\Users\fr\node_modules\express\lib\router\index.js:161:37)
at param (C:\Users\fr\node_modules\express\lib\router\index.js:135:11)
Here's my code:
var io = require('socket.io');
var express = require('express');
var app = express(),
http = require('http'),
server = http.createServer(app),
socket = require('socket.io').listen(server);
app.configure(function(){
app.use(express.static(__dirname));
});
app.get('/', function(req, res, next){
res.render('./test.html');
});
server.listen(8333);
This is my project folder structure:
node_modules/
express/
socket.io/
apps/
chat.js
test.html
This is my new app.configure:
app.configure(function(){
app.use(express.static(path.join(__dirname, 'public')));
});
But that code fails with this error:
path is not defined
I am assuming that test.html is a static file. To render static files, use the static middleware like so:
app.use(express.static(path.join(__dirname, 'public')));
This tells Express to look for static files in the public directory of the application.
Once you have specified this, simply point your browser to the location of the file and it should display.
If, however, you want to render the views, then you have to use the appropriate renderer for it. The list of renderers is defined in the consolidate.js library.
Once you have decided which library to use just install it. I use mustache so here is a snippet of my app file:
var engines = require('consolidate');
app.set('views', __dirname + '/views');
app.engine('html', engines.mustache);
app.set('view engine', 'html');
This tells Express to—
Look for files to render in the views directory
Render the files using mustache
The extension of the file is .html (you can use .mustache too).
A simple way is to use the EJS template engine for serving .html files. Put this line right next to your view engine setup:
app.engine('html', require('ejs').renderFile);
Install the ejs module from npm:
npm install ejs
Then just paste below two lines in your main file (app.js or main.js):
app.set('view engine', 'html');
app.engine('html', require('ejs').renderFile);
Install consolidate and mustache by executing the below command in your project folder.
sudo npm install consolidate mustache --save
And make the following changes to your app.js file
var engine = require('consolidate');
app.set('views', __dirname + '/views');
app.engine('html', engine.mustache);
app.set('view engine', 'html');
And now HTML pages will be rendered properly.
I think you might need to declare a view engine. If you want to use a view/template engine:
app.set('view engine', 'ejs');
or
app.set('view engine', 'jade');
But to render plain HTML, see this post.
Use res.sendFile() instead of res.render(). What you're trying to do is send a whole file.
Try installing the html module from npm:
npm i html

Categories

Resources