Handlebars Templating Engine Not Defined - javascript

I am working through Web Development with Node & Express: Leveraging the JavaScript Stack, by Ethan Brown. I am working in chapter three, which introduces basic concepts concerning Express. I created the app, meadowlark.js, as the book has said, and I am getting this error concerning the Handlebars Templating Engine:
ReferenceError: handlebars is not defined
at Object.<anonymous> (/PROJECT_STORAGE/site/meadowlark.js:7:26)
at Module._compile (module.js:410:26)
at Object.Module._extensions..js (module.js:417:10)
at Module.load (module.js:344:32)
at Function.Module._load (module.js:301:12)
at Function.Module.runMain (module.js:442:10)
at startup (node.js:136:18)
at node.js:966:3
Here is the code for how I setup Handlebars and the rest of meadowlark.js:
var express = require('express');
var app = express();
// setup handlebars view engine
var handlbars = require('express-handlebars').create({ defaultLayout: 'main' });
app.engine('handlebars', handlebars.engine);
app.set('view engine', 'handlebars');
app.set('views', __dirname + '/views');
app.set('port', process.env.PORT || 3000);
app.get('/', function(req, res) {
res.render('home');
});
app.get('/about', function(req, res) {
res.type('about');
});
// custom 404 pg
app.use(function(req, res) {
res.status(404);
res.render('404');
});
// custom 500 pg
app.use(function(err, req, res, next) {
//console.error(err.stack);
res.status(500);
res.render('500');
});
app.listen(app.get('port'), function() {
console.log('Express started on localhost:' + app.get('port') + '; press Ctrl-C to terminate.');
});
How can I fix my code to make Handlebars initialize correctly and make handlebars.js run?

Typo var handlbars = require('express-handlebars').create({ defaultLayout: 'main' });
should be var handlebars.
Pro tip: Use a linter in your ide.

Related

Facing problems while using HBS

I am a total noob in Backend and I am learning Express and using HBS as template engine.
This happens to me every time while using hbs partials in Express.
Code
const express = require("express");
const app = express();
const hbs = require("hbs");
const path = require("path");
const port = process.env.PORT || 3000;
// public static path
const static_path = path.join(__dirname, "../public");
const templates_path = path.join(__dirname, "../templates/views");
const partials_path = path.join(__dirname, "../templates/partials");
app.set("view engine", "hbs");
app.set("views", templates_path);
hbs.registerPartial(partials_path);
app.use(express.static(static_path));
// routing
app.get("/", (req, res) => {
res.render("index");
});
app.get("/about", (req, res) => {
res.render("about");
});
app.get("/weather", (req, res) => {
res.render("weather");
});
app.get("*", (req, res) => {
res.status(404).render("404error");
});
app.listen(port, () => {
console.log("listning on port " + port);
});
Error
throw new _exception2['default']('Attempting to register a partial called "' + name + '" as undefined');
^
Error: Attempting to register a partial called "D:\Projects\ExpressWeb\templates\partials" as undefined
at HandlebarsEnvironment.registerPartial (D:\Projects\ExpressWeb\node_modules\handlebars\dist\cjs\handlebars\base.js:80:15)
at Instance.registerPartial (D:\Projects\ExpressWeb\node_modules\hbs\lib\hbs.js:222:35)
at Object.<anonymous> (D:\Projects\ExpressWeb\src\app.js:15:5)
at Module._compile (internal/modules/cjs/loader.js:1085:14)
at Object.Module._extensions..js (internal/modules/cjs/loader.js:1114:10)
at Module.load (internal/modules/cjs/loader.js:950:32)
at Function.Module._load (internal/modules/cjs/loader.js:790:14)
at Function.executeUserEntryPoint [as runMain] (internal/modules/run_main.js:76:12)
at internal/main/run_main_module.js:17:47 {
description: undefined,
fileName: undefined,
lineNumber: undefined,
endLineNumber: undefined,
number: undefined
}
Adding this to increase the discripting because Stack Overflow is not letting me post this because i am uplaoding more code than discription and i dont know what to ask more.
According to the docs it is - hbs.registerPartials(partials_path);
not hbs.registerPartial(partials_path);

Route.post() requires a callback function but got a [object String]

I'm trying to make my vocabulary app using and changing MDN node/express tutorial.
MDN tutorial works perfectly but mines doesn't work.
Here are the errors :
Error: Route.post() requires a callback function but got a [object String]
at Route.(anonymous function) [as post] (d:\web-projects\vocastudy\node_modules\express\lib\router\route.js:202:15)
at Function.proto.(anonymous function) [as post] (d:\web-projects\vocastudy\node_modules\express\lib\router\index.js:510:19)
at Object.<anonymous> (d:\web-projects\vocastudy\routes\catalog.js:9:8)
at Module._compile (module.js:652:30)
at Object.Module._extensions..js (module.js:663:10)
at Module.load (module.js:565:32)
at tryModuleLoad (module.js:505:12)
at Function.Module._load (module.js:497:3)
at Module.require (module.js:596:17)
at require (internal/module.js:11:18)
at Object.<anonymous> (d:\web-projects\vocastudy\app.js:9:21)
at Module._compile (module.js:652:30)
at Object.Module._extensions..js (module.js:663:10)
at Module.load (module.js:565:32)
at tryModuleLoad (module.js:505:12)
at Function.Module._load (module.js:497:3)
And app.js :
var createError = require('http-errors');
var express = require('express');
var path = require('path');
var cookieParser = require('cookie-parser');
var logger = require('morgan');
var indexRouter = require('./routes/index');
var usersRouter = require('./routes/users');
var catalogRouter = require('./routes/catalog');
var app = express();
// Set up mongoose connection
var mongoose = require('mongoose');
var mongoDB = 'mongodb://127.0.0.1/vocastudy';
mongoose.connect(mongoDB);
mongoose.Promise = global.Promise;
var db = mongoose.connection;
db.on('error', console.error.bind(console, 'MongoDB connection error'));
// view engine setup
app.set('views', path.join(__dirname, 'views'));
app.set('view engine', 'pug');
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);
app.use('/catalog', catalogRouter);
// catch 404 and forward to error handler
app.use(function(req, res, next) {
next(createError(404));
});
// error handler
app.use(function(err, req, res, next) {
// set locals, only providing error in development
res.locals.message = err.message;
res.locals.error = req.app.get('env') === 'development' ? err : {};
// render the error page
res.status(err.status || 500);
res.render('error');
});
module.exports = app;
And my routes catalog.js :
var express = require('express');
var router = express.Router();
var vocabulary_controller = require('../controllers/vocabularyController');
// GET request for creating a Word. NOTE This must come before routes tha display Word (uses id).
router.get('/create', vocabulary_controller.create_get);
/* POST create page */
router.post('/create', vocabulary_controller.create_post);
/* GET home page. */
router.get('/', vocabulary_controller.list);
/* GET detail page */
router.get('/:id', vocabulary_controller.detail);
module.exports = router;
And controllers vocabulary.js :
exports.create_post = [
// Validate fields
body('word').isLength({ min: 1 }).trim().withMessage('word must be specified'),
body('meaning').isLength({ min: 1 }).trim().withMessage('meaning must be specified'),
body('reference').isLength({ min: 1 }).trim().withMessage('reference must be specified'),
// Sanitize (trim and escape) the fields
sanitizeBody('word').trim().escape(),
sanitizeBody('meaning').trim().escape(),
sanitizeBody('reference').trim(),escape(),
// Process request after validation and sanitization
(req, res, next) => {
// Extract the validation errors from a request.
const errors = validationResult(req);
// Create vocabulary object with escaped and trimmed data.
if(!errors.isEmpty()) {
// There are errors.
res.render('create', { title: 'Create Word', word: req.body, errors: errors.array() });
return;
} else {
// Data from form is valid.
// Create a Vocabulary object with escaped and trimmed data.
var vocabulary = new Vocabulary({
word: req.body.word,
meaning: req.body.meaning,
reference: req.body.reference
});
vocabulary.save(function(err) {
if(err) { return next(err); };
// Successful - redirect to new word record.
res.redirect(vocabulary.url);
});
};
}
];
I think that create post controller is array so I got error but it perfectly works on MDN's tutorial version. I can't find my problem.
why did i get route.post error?
NB that mdn's tutorial is using array too.
It seems that in Express, app.post() accepts parameters that can be arrays of callbacks, but router.post() only accepts functions as callbacks. Try providing the array directly to an express app instead of the router, or as #TimothyLee suggested, use the spread syntax to turn the array into individual parameters to the router.post() function.

Errors with socket.io?

I recently implemented socket.io and running into some strange errors.
The error messages I am getting aren't incredibly helpful and trying to figure out what is causing this.
Here are the contents of my app.js -
app.js
// Express Requirements
var express = require('express');
var path = require('path');
var favicon = require('serve-favicon');
var logger = require('morgan');
var cookieParser = require('cookie-parser');
var bodyParser = require('body-parser');
var multer = require('multer');
// Formidable Requirements
var formidable = require('formidable');
var util = require('util');
var routes = require('./routes/index');
var app = require('express')();
var server = require('http').Server(app);
var io = require('socket.io')(server);
server.listen(8888);
// view engine setup
app.set('views', path.join(__dirname, 'views'));
app.set('view engine', 'hjs');
// Non Default Code
// Socket.io Code
io.on('connection', function (client) {
console.log("Client connected!");
client.emit('newcommer',{status: true, newuser: 'paul'});
});
// End Socket.io Code
// End Non Default Code
// uncomment after placing your favicon in /public
//app.use(favicon(__dirname + '/public/favicon.ico'));
app.use(logger('dev'));
app.use(bodyParser.json());
app.use(bodyParser.urlencoded({ extended: false }));
app.use(cookieParser());
app.use(express.static(path.join(__dirname, 'public')));
app.use('/', routes);
// catch 404 and forward to error handler
app.use(function(req, res, next) {
var err = new Error('Not Found');
err.status = 404;
next(err);
});
// error handlers
// development error handler
// will print stacktrace
if (app.get('env') === 'development') {
app.use(function(err, req, res, next) {
res.status(err.status || 500);
res.render('error', {
message: err.message,
error: err
});
});
}
// production error handler
// no stacktraces leaked to user
app.use(function(err, req, res, next) {
res.status(err.status || 500);
res.render('error', {
message: err.message,
error: {}
});
});
module.exports = app;
Error Message
events.js:72
throw er; // Unhandled 'error' event
^
Error: listen EADDRINUSE
at errnoException (net.js:904:11)
at Server._listen2 (net.js:1042:14)
at listen (net.js:1064:10)
at Server.listen (net.js:1138:5)
at Object.<anonymous> (/Users/blah/blah/app.js:20:8)
at Module._compile (module.js:456:26)
at Object.Module._extensions..js (module.js:474:10)
at Module.load (module.js:356:32)
at Function.Module._load (module.js:312:12)
at Module.require (module.js:364:17)
28 Nov 19:10:39 - [nodemon] app crashed - waiting for file changes before starting...
Does anyone see anything that is off that could be causing this error?
Edits For Culprits:
Once these lines are removed then the code does not produce any errors:
var server = require('http').Server(app);
var io = require('socket.io')(server);
// Socket.io Code
io.on('connection', function (client) {
console.log("Client connected!");
client.emit('newcommer',{status: true, newuser: 'paul'});
});
// End Socket.io Code
Are you sure, you are getting this error ???
I think you have another server running on the same port server.listen(8888);
Either close that running server or changer the port as server.listen(8000);

Object #<Server> has no method 'use' [Express+ShareJS]

Environment
Express 3.2.4
ShareJS 0.6.2
OS X 10.8.3
Goal
I am trying to get ShareJS running inside of an Express app.
Problem
I get the following error on running node app.js:
/Users/eric/Documents/Projects/collabit/node_modules/share/src/server/index.coffee:52
server.use(options.staticpath, connect["static"]("" + __dirname + "/../.
^
TypeError: Object #<Server> has no method 'use'
at Function.create.attach.attach (/Users/eric/Documents/Projects/collabit/node_modules/share/src/server/index.coffee:52:14)
at Object.<anonymous> (/Users/eric/Documents/Projects/collabit/app.js:43:16)
at Module._compile (module.js:449:26)
at Object.Module._extensions..js (module.js:467:10)
at Module.load (module.js:356:32)
at Function.Module._load (module.js:312:12)
at Module.runMain (module.js:492:10)
at process.startup.processNextTick.process._tickCallback (node.js:244:9)
I used the express cli interface to generate an app and was working with SocketIO just fine before deciding to swap in ShareJS. I'm pretty sure my issue is how I'm crafting the server but I don't know enough to figure out how I should be creating the server object to keep the express functionality but allow ShareJS to attach.b
Code
/**
* Module dependencies.
*/
var express = require('express')
, sharejs = require('share')
, routes = require('./routes')
, user = require('./routes/user')
, http = require('http')
, path = require('path');
var app = express();
app.configure(function(){
app.set('port', process.env.PORT || 3000);
app.set('views', __dirname + '/views');
app.set('view engine', 'jade');
app.use(express.favicon());
app.use(express.logger('dev'));
app.use(express.bodyParser());
app.use(express.methodOverride());
app.use(app.router);
app.use(express.static(path.join(__dirname, 'public')));
});
app.configure('development', function(){
app.use(express.errorHandler());
});
app.get('/', routes.index);
app.get('/users', user.list);
var server = http.createServer(app).listen(app.get('port'), function(){
console.log("Express server listening on port " + app.get('port'));
});
/**
* ShareJS Code
*/
var options = {db: {type: 'none'}};
sharejs.server.attach(server, options);
Question
What is the proper way to create my server object in order to allow ShareJS to attach to it while retaining the Express functionality.
Thanks!
Thanks in advance for help and let me know if any additional information is needed.
I had a similar issue. After a lot of trial and error this worked for me:
var express = require('express'),
http = require('http'),
sharejs = require('share').server;
var app = express();
var server = http.createServer(app);
var options = {db:{type:'none'}}; // See docs for options. {type: 'redis'} to enable persistance.
// Attach the sharejs REST and Socket.io interfaces to the server
sharejs.attach(app, options);
app.use(app.router);
app.set('views', __dirname + '/views');
app.engine('html', require('ejs').renderFile);
server.listen(8000, function () {
console.log('Server running at http://127.0.0.1:8000/');
});
app.get('/', function(req, res) {
res.render('share.html');
});
Then in views/share.html I had the standard example html:
<!DOCTYPE html>
<html>
<head>
<title>Test</title>
<script src="http://ajaxorg.github.com/ace/build/src/ace.js"></script>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script src="/channel/bcsocket.js"></script>
<script src="/share/share.js"></script>
<script src="/share/ace.js"></script>
<script>
$(document).ready(function() {
var editor = ace.edit("editor");
sharejs.open('hello', 'text', 'http://localhost:8000/channel', function (error, doc) {
doc.attach_ace(editor);
});
});
</script>
<style>
#editor {
width: 200px;
height: 100px;
}
</style>
</head>
<body>
<div id="editor"></div>
</body>
</html>

Strange errors trying to use haml-coffee with an expressJS app

Here is my app.js file following the haml-coffee guides:
// misc requirements
var express = require('express')
, routes = require('./routes')
, http = require('http')
, path = require('path');
// setup app
var app = express();
// set default engine to haml-coffee
app.engine( 'hamlc', require('haml-coffee'.__express ));
// configure misc stuff
app.configure(function(){
app.set('port', process.env.PORT || 3000); // set localhost port to 3000
app.set('views', __dirname + '/views'); // setup views (templates)
app.set('view engine', 'hamlc'); // use haml-coffee as default templating engine
app.set('title', 'Learn Some Code'); // set the website title
app.use(express.favicon()); // favicon handling
app.use(express.logger('dev')); // logging
app.use(express.bodyParser());
app.use(express.methodOverride());
app.use(app.router); // use the router
app.use(express.static(path.join(__dirname, 'public')));
});
// only configure this for development
app.configure('development', function(){
app.use(express.errorHandler());
});
app.get('/', routes.index);
http.createServer(app).listen(app.get('port'), function(){
console.log("Express server listening on port " + app.get('port'));
});
But when I run node app.js... I get this strange error:
module.js:236
var start = request.substring(0, 2);
^
TypeError: Cannot call method 'substring' of undefined
at Function.Module._resolveLookupPaths (module.js:236:23)
at Function.Module._resolveFilename (module.js:328:31)
at Function.Module._load (module.js:280:25)
at Module.require (module.js:362:17)
at require (module.js:378:17)
at Object.<anonymous> (/Users/chris/src/learnsomecode/app.js:11:22)
at Module._compile (module.js:449:26)
at Object.Module._extensions..js (module.js:467:10)
at Module.load (module.js:356:32)
at Function.Module._load (module.js:312:12)
Your require has a slight typo in it. Change
app.engine( 'hamlc', require('haml-coffee'.__express ));
to
app.engine( 'hamlc', require('haml-coffee').__express );
'haml-coffee'.__express resolves to undefined, which makes require(undefined) throw the Cannot call method 'substring' of undefined error.

Categories

Resources