koa-head

A document head manager middleware for koa.

Installation

npm i koa-head

TL;DR example

note: this package can be used as native ES6 module but has fallback to CommonJS require.

import Koa from "koa";
import koaHead from "koa-head";

const app = new Koa();

app
  .use(koaHead())
  .use(async (ctx, next) => {
    ctx.documentHead.setTitle("Title for my webpage");
    ctx.documentHead.addMetaTag({
      name: "twitter:card",
      content: "summary_large_image"
    });
    ctx.documentHead.addLink({ rel: "canonical", href: "index.html" });
    ctx.documentHead.addStyle("body { background: aliceblue; }");
    ctx.documentHead.addScript("{ fixture: 'test fixture' }");

    await next();
  })
  .use(ctx => {
    const documentHead = ctx.documentHead.toHTML();
    const userData = { name: "John Doe" };

    await ctx.myAwesomeLayoutEngine("user-view", {
      documentHead,
      userData
    });
  });

app.listen(3333);

will make documentHead variable to contain:

<title>Title for my webpage</title>
<meta name="twitter:card" content="summary_large_image" />
<link rel="canonical" href="index.html" />
<style type="text/css">
  body {
    background: aliceblue;
  }
</style>
<script type="text/javascript">
  {
    fixture: "test fixture";
  }
</script>

so you can use it in a place in your layout.

Available methods

`.setTitle( string | object )`

Set document title.

`.addMetaTag( object )`

Add <meta /> tag.

`.addLink( object )`

Add <link /> tag.

`.addStyle( string | object )`

Add <style /> tag.

`.addScript( string | object )`

Add <script /> tag.

`.toHtml()`

Render all set content to coresponding HTML tags.

Middleware factory function config

Option	Description	Default value
`ctxNamespace`	Name under which middleware is exposed in `cxt` object and is used by other middlewares i.e. `ctx.documentHead.setTitle('Hello')`.	`'documentHead'`
`stateNamespace`	Name under which middleware stores values in `ctx.state`	`'documentHead'`
`documentTitleFormatter`	If set, all values passed to `.setTitle()` function will pe parsed by this formatter.	`title => title`
`toHtml`	Config for toHtml function.	`{ [default_values] }`
`toHtml.tagSeparator`	Separator between tags inside one group.	`\n`
`toHtml.groupSeparator`	Separator between group of tags.	`\n\n`

reod / koa-head