Package Exports
- vision
This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (vision) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.
Readme
#vision
Templates rendering plugin support for hapi.js.
Lead Maintainer - Jeffrey Jagoda
vision decorates the server, request, and reply interfaces with additional methods for managing view engines that can be used to render templated responses. vision also provides a built-in handler implementation for creating templated responses.
You will need to install vision using something like npm install --save vision before you can register it.
const server = new Hapi.Server();
server.connection({ port: 8080 });
server.register(require('vision'), (err) => {
if (err) {
console.log("Failed to load vision.");
}
});NOTE: Vision is included with and loaded by default in Hapi < 9.0.
See API.md for detailed usage information.
Examples
vision is compatible with most major templating engines out of the box. Engines that don't follow the normal API pattern can still be used by mapping their API to the vision API. Working code for the following examples can be found in the examples directory.
EJS
const server = new Hapi.Server();
server.connection({ port: 8000 });
const rootHandler = function (request, reply) {
reply.view('index', {
title: 'examples/views/ejs/index.js | Hapi ' + request.server.version,
message: 'Index - Hello World!'
});
};
server.register(require('vision'), (err) => {
if (err) {
throw err;
}
server.views({
engines: { ejs: require('ejs') },
relativeTo: __dirname,
path: 'templates'
});
server.route({ method: 'GET', path: '/', handler: rootHandler });
});Handlebars
const server = new Hapi.Server();
server.connection({ port: 8000 });
const handler = function (request, reply) {
reply.view('basic/index', {
title: 'examples/views/handlebars/basic.js | Hapi ' + request.server.version,
message: 'Hello World!'
});
};
server.register(require('vision'), (err) => {
if (err) {
throw err;
}
server.views({
engines: { html: require('handlebars') },
path: __dirname + '/templates'
});
server.route({ method: 'GET', path: '/', handler: handler });
});Jade
const server = new Hapi.Server();
server.connection({ port: 8000 });
const rootHandler = function (request, reply) {
reply.view('index', {
title: 'examples/views/jade/index.js | Hapi ' + request.server.version,
message: 'Index - Hello World!'
});
};
const aboutHandler = function (request, reply) {
reply.view('about', {
title: 'examples/views/jade/index.js | Hapi ' + request.server.version,
message: 'About - Hello World!'
});
};
server.register(require('vision'), (err) => {
if (err) {
throw err;
}
server.views({
engines: { jade: require('jade') },
path: __dirname + '/templates',
compileOptions: {
pretty: true
}
});
server.route({ method: 'GET', path: '/', handler: rootHandler });
server.route({ method: 'GET', path: '/about', handler: aboutHandler });
});Mustache
const server = new Hapi.Server();
server.connection({ port: 8000 });
const rootHandler = function (request, reply) {
reply.view('index', {
title: 'examples/views/mustache/index.js | Hapi ' + request.server.version,
message: 'Index - Hello World!'
});
};
server.register(require('vision'), (err) => {
if (err) {
throw err;
}
server.views({
engines: {
html: {
compile: function (template) {
Mustache.parse(template);
return function (context) {
return Mustache.render(template, context);
};
}
}
},
relativeTo: __dirname,
path: 'templates'
});
server.route({ method: 'GET', path: '/', handler: rootHandler });
});Nunjucks
const server = new Hapi.Server();
server.connection({ port: 8000 });
const rootHandler = function (request, reply) {
reply.view('index', {
title: 'examples/views/nunjucks/index.js | Hapi ' + request.server.version,
message: 'Index - Hello World!'
});
};
server.register(require('vision'), (err) => {
if (err) {
throw err;
}
server.views({
engines: {
html: {
compile: function (src, options) {
var template = Nunjucks.compile(src, options.environment);
return function (context) {
return template.render(context);
};
},
prepare: function (options, next) {
options.compileOptions.environment = Nunjucks.configure(options.path, { watch : false });
return next();
}
}
},
path: Path.join(__dirname, 'templates')
});
server.route({ method: 'GET', path: '/', handler: rootHandler });
});