Develop Reference

Express Render not working return error: No default engine was specified and no extension was provided

I'm writing an Express application without a template engine I am using just using HTML as the template engine.
app.set('view engine', 'html');
actually, the whole code was generated using express-generator and I set the view to --no-view Flag and the index URL page runs well but trying another URL like users or any other except the index URL does work all it shows is
No default engine was specified and no extension was provided.
But if I Add the above code app.set('view engine', 'html'); it returns
Error: Cannot find module 'html'. Below are the codes.
var indexRouter = require('./routes/index');
var usersRouter = require('./routes/users');
var addressRouter = require('./routes/address');
var app = express();
app.set('view engine', 'html');
app.use(logger('dev'));
app.use(express.json());
app.use(express.urlencoded({ extended: false }));
app.use(cookieParser());
app.use(express.static(path.join(__dirname, 'public')));
app.use('/', indexRouter);
app.use('/users', usersRouter);
module.exports = app;
And the userRouter user.js
var express = require('express');
var router = express.Router();
/* GET users listing. */
router.get('/', function(req, res, next) {
res.render('index');
});
module.exports = router;
For Home Page
router.get('/', function(req, res, next) {
res.render('index');
});
Can someone please tell what is wrong here.

To serve html you do not need to use the view engine, just use express.static, as you are already using
app.use (express.static (path.join (__ dirname, 'public')));

As #Henrique said, you are already able to render staticHTML. What’s tripping you up is the res.render calls. Those specifically exist to call a template. Switch to res.send and your error should go away.

What I did was with sendFile on the route controller like the userRoute controller
res.sendFile(path.resolve(__dirname,'../public/index.html'));
and I remove the set engine
app.set('view engine', 'html');
But the index page works perfectly without the above tweak.

How can I use Handlebars with Express?

The question is actually not difficult to understand, I do not know how to implement handlebars in Express.
That's what I've already coded:
var express = require('express');
var app = express();
app.get('/', function (req, res, next) {
return res.render('index');
});
Now is my question, how to set handlebars as app engine for express?

Here is the code as I currently use and learned. I have added a note behind every important line so that you understand it well!
var express = require('express');
var app = express();
var handlebars = require('express-handlebars');
app.engine('handlebars', handlebars({ // Here we define what format you will use (That means what's at the end of each file, for example test.handlebars or test.hbs)
defaultLayout: 'main', // That's the name of your template file. In my case it's main.handlebars
layoutsDir: __dirname + '/views/layouts/' // That's the directory where the template file is
}));
app.set('views', path.join(__dirname, 'views')); // Here you give express the information that it has to look at all files that are in the path /views
app.set('view engine', 'handlebars'); // Here you say express that you are using handlebars to build your website
app.get('/home', function (req, res, next) { // That's a simple GET request (This GET request gets triggered when you enter http://localhost/home for example)
return res.render('index'); // Here we render the index.handlebars file (that is in the /views folder)
});

app.post is not a function express node

I had all my routes in server.js but I wanted to make it modular and put into a folder called routes. I created a file called apis.js in routes folder but as I did that I get TypeError: app.post is not a function
server.js:
var express = require('express');
var app = express();
var bodyParser = require('body-parser');
var urlencode = bodyParser.urlencoded({ extended: true});
app.use(express.static('public'));
var apis = require('./routes/apis');
app.use('/', apis);
module.exports = app;
apis.js:
module.exports = function(app){
app.get('/', function(req, res) {
res.send('OK');
});
app.post('/idea', function(req, res) {
...
});
};
Also, having module.exports = app in server.js is important as I have tests running and I want a instance of app everytime.
What am I missing?

Better approach :-
server.js
var express = require('express');
var app = express();
var bodyParser = require('body-parser');
var urlencode = bodyParser.urlencoded({ extended: true});
app.use(express.static('public'));
var apis = require('./routes/apis');
app.use('/', apis);
module.exports = app;
apis.js :-
var router = require('express').Router();
router.post('/url',function(req,res,next){
//your code
})
module.exports = router

You need to pass in your express app into your apis module so it can attach the routes to your app. If you want to use app.use to put your routes in a different root path, you can create another express router, and attach your routes to that, then app.use that router:
server.js:
var express = require('express');
var app = express();
var bodyParser = require('body-parser');
var urlencode = bodyParser.urlencoded({ extended: true});
app.use(express.static('public'));
var apis = express.Router();
require('./routes/apis')(apis);
app.use('/', apis);
module.exports = app;

There's a couple different methods for connecting your app to your routes, and it looks to me like you are mixing them together, resulting in your error.
The fix already mentioned...
var router = require('express').Router();
router.post('/url',function(req,res,next){
//your code
})
module.exports = router
...works with the way you currently have your server.js file set up.
Another method that doesn't require you to modify your apis.js file is to require it in server.js using
require("./routes/apis.js")(app);
instead of
var apis = require('./routes/apis');
app.use('/', apis);
This ensures that the variable app is passed into the function in apis.js
The first version is recommended, but hopefully this explains why you are getting confused between the two, i.e. because the second is an alternate version.
See Differences between express.Router and app.get? for more information on why the router version is recommended.

templating using handlebars with nodejs to include layout

app.js
var exphbs = require('express-handlebars');
app.engine('handlebars', exphbs({defaultLayout: 'layout'}));
app.set('view engine', 'handlebars');
app.use('/catalog', require('./routes/catalog'));
so in my routes folder I have a folder call catalog then within it I have catalog.js.
In catalog.js I do
var express = require('express');
var router = module.exports = express.Router();
router.get('/', function(req, res) {
res.render('catalog/index');
});
It worked fine when I go to http://localhost:3000/catalog but it excluded from the layout when I try to run http://localhost:3000/catalog/ Any idea why?

There is an npm package (connect-slashes) which installs some middleware which will add a slash on urls without one. This process is called URL canonicalisation.
This is better because you won't display similar content for 'catalog' and 'catalog/' urls which would be bad for SEO (duplicate content penalties).
Package details here:
https://www.npmjs.com/package/connect-slashes
From the command line:
npm install connect-slashes --save

Issue with serving images from express.js

I have issues with serving .png image from my express app. I think there is something wrong with the router setup, because it tries to render page rather than serve a static file. The setup is as follows:
// app.js
// Module dependencies
var express = require('express'),
http = require('http'),
path = require('path'),
session = require('./middlewares/session');
// Create server
var app = module.exports = app ? app : express();
app.set('port', process.env.PORT || 3000);
app.set('view engine', 'jade');
app.set('views', __dirname + '/views');
app.set('view options', { layout: true });
app.use(express.static(path.join(__dirname, '../../public')));
app.use(express.favicon());
app.use(express.logger('dev'));
app.use(express.bodyParser());
app.use(express.methodOverride());
app.use(express.errorHandler());
app.use(express.responseTime());
app.use(express.cookieParser());
app.use(app.router);
var routes = require('./routes')(app);
if ('development' == app.get('env')) {
app.use(express.errorHandler());
}
// Start server
http.createServer(app).listen(app.get('port'), function() {
console.log('Express server listening on port ' + app.get('port'));
console.log(__dirname);
});
Then my routes file looks like this:
// routes.js
module.exports = function(app) {
//Routes
// app.get('/', routes.index);
app.get('/api/places', places);
app.get('/add-review', review);
app.get('/logout', logout);
app.get('/:location?/:category?', session(app), routes.index);
}
The jade view where I'm trying to load an image
# view
img(src="/nodeapp/img/logo-white.png")
I'm using reverse proxy for node app which root is this http://app.com/nodeapp
The folder structure:
public
components
css
img
js
server
srs
views
app.js
test
The error that I'm getting is this:
TypeError: Cannot read property 'logo-white.png' of undefined
at Object.get_listings (/app/server/src/models/vendors.js:354:16)
at exports.index (/app/server/src/handlers/index.js:6:31)
at callbacks (/app/node_modules/express/lib/router/index.js:161:37)
at /app/server/src/middlewares/session.js:13:5
at /app/bbe/server/src/api.js:18:3
at _fulfilled (/app/node_modules/requestify/node_modules/q/q.js:798:54)
at self.promiseDispatch.done (/app/requestify/node_modules/q/q.js:827:30)
at Promise.promise.promiseDispatch (/app/node_modules/requestify/node_modules/q/q.js:760:13)
at /app/node_modules/requestify/node_modules/q/q.js:574:44
at flush (/app/node_modules/requestify/node_modules/q/q.js:108:17)
GET /img/logo-white.png 500 857ms
So, here it's trying to actually render my jade views rather than serving from a static folder. Other static files such as js and css are served fine. Why is this happening?
Thanks!
=== Edit (added function that renders views) ===
exports.index = function(req, res) {
res.locals.location = data().get_location(req.params);
res.locals.categories = data().get_categories(res.locals.location);
res.locals.listings = data().get_listings(res.locals.location, req.params.category);
var meta = {
title: "My app",
module: "/nodeapp/js/core/index/main.js"
};
res.render('nodeapp/index', meta);
};

I had trouble myself with setting the 'views' path, so maybe the issue is the same.
I would try to set different view paths for the different sites I had like so (per app)
// site1.js
app.set('views', __dirname + '/views/site1');
// site2.js
app.set('views', __dirname + '/views/site2');
For some reason, it just wouldn't find the views to render. So, I had to set them all back to just '/views' directory, and when I rendered them, I included the extra directory there, and that worked.
I'm thinking if you restructured your directories so this
app.use(express.static(path.join(__dirname, '../../public')));
becomes
app.use(express.static(path.join(__dirname, '/public')));
that it might start working for you. I'm assuming all the other things in your public directories aren't being handled right either. If it's just that png file...check the name, rename it, fiddle with it.