New Case Study:See how Anthropic automated 95% of dependency reviews with Socket.Learn More →

layout-wrapper

Package Overview

Dependencies

Advanced tools

Install Socket

Detect and block malicious and high-risk dependencies

Install

layout-wrapper

Wrap the contents in the layout template. gulpfriendly.

1.1.2
latest
Source
npm

Version published: 7 years ago

Maintainers: 1

Created: 9 years ago

Source

layout-wrapper v1.1.2

Wrap the contents in the layout template. gulpfriendly.

This module is designed to be used with gulp or bulbo.

NOTE: See also layout1, which is a more simple and flexible version of this module.

Install

npm install layout-wrapper

Usage

This module works with gulp's file stream.

gulpfile.js:

const frontMatter = require('gulp-front-matter')
const wrapper = require('layout-wrapper')

gulp.src('src/pages/*.html')
  .pipe(frontMatter())
  .pipe(wrapper({
    layout: 'src/layouts',
    data: {name: 'world'},
    engine: 'nunjucks'
  }))
  .pipe(gulp.dest('site/'))

Note You still need to install the template engine. (In the above case, you need to install nunjucks)

src/pages/sample.html:

---
title: Hello
layout: default
---
<p>Hello, {{ name }}!</p>

src/layouts/default.nunjucks:

<html>
<head>
  <title>{{ file.frontMatter.title }}</title>
</head>
<body>
  {{ contents }}
</body>
</html>

The above settings outputs the following html into the path site/sample.html:

<html>
<head>
  <title>Hello</title>
</head>
<body>
  <p>Hello, world!</p>
</body>
</html>

Use with bulbo

bulbofile.js:

const frontMatter = require('gulp-front-matter')
const wrapper = require('layout-wrapper')

asset('src/pages/*.html')
  .pipe(frontMatter())
  .pipe(wrapper({
    layout: 'src/layouts',
    data: {name: 'world'},
    engine: 'nunjucks'
  }))

API

const wrapper = require('layout-wrapper')

wrapper(options)

@param {object} options - The options
@param {string} options.layout - The path to the directory of layout files. If nothing is given, then this throws an error. Required.
@param {string} [options.engine] - The name of the template engine. Default is lodash. Please see the document of consolidate.js for what's available here.
@param {object} [options.data] - The additional data which is passed to the layout engine.
@param {string} [options.frontMatterProp] - The name of the property where the front matter object is stored in vinyl. Default is frontMatter.
@param {string} [options.layoutProp] - The name of the property of layout pattern in a front matter. Default is 'layout'.
@param {string} [options.defaultLayout] - The default layout name when the layout property is not given in the front matter. Default is default.
@param {string} [options.extname] - The name of file extension name for template files. Default is '.' + engine name e.g. .lodash .ejs .nunjucks etc.
@return {Transform<Vinyl, Vinyl>}

This returns the transform stream from vinyl to vinyl. This transforms

Alias methods

You can also use alias methods.

gulp.src('src/pages/*.html')
  .pipe(frontMatter())
  .pipe(wrapper.nunjucks({
    layout: 'src/layouts',
    data: {name: 'world'}
  }))
  .pipe(gulp.dest('site/'))

The above is equivalent of engine: 'nunjucks' call of wrapper.

License

MIT

Keywords

FAQs

What is layout-wrapper?

Is layout-wrapper well maintained?

Package last updated on 30 Aug 2017

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.

Install