
Security News
Deno 2.2 Improves Dependency Management and Expands Node.js Compatibility
Deno 2.2 enhances Node.js compatibility, improves dependency management, adds OpenTelemetry support, and expands linting and task automation for developers.
Wraps templates with layouts. Layouts can use other layouts and be nested to any depth. This can be used 100% standalone to wrap any kind of file with banners, headers or footer content. Use for markdown, HTML, handlebars views, lo-dash templates, etc. La
Wraps templates with layouts. Layouts can use other layouts and be nested to any depth. This can be used 100% standalone to wrap any kind of file with banners, headers or footer content. Use for markdown, HTML, handlebars views, lo-dash templates, etc. Layouts can also be vinyl files.
(TOC generated by verb using markdown-toc)
Install with npm:
$ npm install --save layouts
var renderLayouts = require('layouts');
Basic example
In this example, two layouts are used:
one
, will wrap the stringtwo
, will wrap the first layoutvar layouts = {
one: {content: 'one before\n{% body %}\none after', layout: 'two'},
two: {content: 'two before\n{% body %}\ntwo after'},
};
// `one` is the name of the first layout to use on the provided string
renderLayouts('<div>Wrap me with a layout!!!</div>', 'one', layouts);
Results in:
two before
one before
<div>Wrap me with a layout!!!</div>
one after
two after
HTML
This example shows how to use nested HTML layouts to wrap content:
var layouts = {};
layouts.base = {
path: 'base.tmpl',
content: [
'<!DOCTYPE html>',
'<html lang="en">',
' <head>',
' <meta charset="UTF-8">',
' <title>Home</title>',
' </head>',
' <body>',
' {% body %}',
' </body>',
'</html>',
].join('\n')
};
// this `nav` layout will be wrapped with the `base` layout
layouts.nav = {
path: 'nav.tmpl',
layout: 'base',
content: '<nav>\n{% body %}\n</nav>'
};
// this string will be wrapped with the `nav` layout
var str = [
'<ul class="categories">',
' <li class="active"> <a href="#"> Development </a> </li>',
' <li> <a href="#"> Design </a> </li>',
' <li> <a href="#"> Node.js </a> </li>',
'</ul>'
].join('\n')
// `nav` is the name of the layout to use
renderLayouts(str, nav, layouts);
Results in something like:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Home</title>
</head>
<body>
<nav>
<ul class="categories">
<li class="active"> <a href="#"> Development </a> </li>
<li> <a href="#"> Design </a> </li>
<li> <a href="#"> Node.js </a> </li>
</ul>
</nav>
</body>
</html>
By default, {% body %}
is used as the placeholder (insertion point) for content, but this can easily be customized with the following options:
layoutDelims
: the delimiters to use. This can be a regex, like /{{([^}]+)\}}/
, or an array of delimiter strings, like ['{{', '}}']
contentTag
: the name of the content placeholder tag (defaults to body).Wrap one or more layouts around string
.
Params
string
{String}: The string to wrap with a layout.layoutName
{String}: The name (key) of the layout object to use.layouts
{Object}: Object of layout objects.options
{Object}: Optionally define a defaultLayout
(string), pass custom delimiters (layoutDelims
) to use as the placeholder for the content insertion point, or change the name of the placeholder tag with the contentTag
option.fn
{Function}: Optionally pass a function to modify the context as each layout is applied.returns
{String}: Returns the original string wrapped with one or more layouts.Example
renderLayouts(string, layoutName, layouts, options, fn);
v0.12.0
options.tag
to options.contentTag
assert
instead of should
v0.11.0
path
property, following vinyl conventions.Pull requests and stars are always welcome. For bugs and feature requests, please create an issue.
(This document was generated by verb-generate-readme (a verb generator), please don't edit the readme directly. Any changes to the readme must be made in .verb.md.)
To generate the readme and API documentation with verb:
$ npm install -g verb verb-generate-readme && verb
Install dev dependencies:
$ npm install -d && npm test
Brian Woodward
Copyright © 2016, Brian Woodward. Released under the MIT license.
This file was generated by verb, v0.9.0, on July 15, 2016.
FAQs
Wraps templates with layouts. Layouts can use other layouts and be nested to any depth. This can be used 100% standalone to wrap any kind of file with banners, headers or footer content. Use for markdown, HTML, handlebars views, lo-dash templates, etc. La
The npm package layouts receives a total of 22,200 weekly downloads. As such, layouts popularity was classified as popular.
We found that layouts demonstrated a not healthy version release cadence and project activity because the last version was released a year ago. It has 2 open source maintainers collaborating on the project.
Did you know?
Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.
Security News
Deno 2.2 enhances Node.js compatibility, improves dependency management, adds OpenTelemetry support, and expands linting and task automation for developers.
Security News
React's CRA deprecation announcement sparked community criticism over framework recommendations, leading to quick updates acknowledging build tools like Vite as valid alternatives.
Security News
Ransomware payment rates hit an all-time low in 2024 as law enforcement crackdowns, stronger defenses, and shifting policies make attacks riskier and less profitable.