2.0.0 • Published 5 years ago

koa-head v2.0.0

Weekly downloads
28
License
ISC
Repository
github
Last release
5 years ago

Known Vulnerabilities

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

OptionDescriptionDefault value
ctxNamespaceName under which middleware is exposed in cxt object and is used by other middlewares i.e. ctx.documentHead.setTitle('Hello').'documentHead'
stateNamespaceName under which middleware stores values in ctx.state'documentHead'
documentTitleFormatterIf set, all values passed to .setTitle() function will pe parsed by this formatter.title => title
toHtmlConfig for toHtml function.{ [default_values] }
toHtml.tagSeparatorSeparator between tags inside one group.\n
toHtml.groupSeparatorSeparator between group of tags.\n\n
2.0.0

5 years ago

1.2.0

5 years ago

1.1.1

5 years ago

1.1.0

5 years ago

1.0.3

5 years ago

1.0.2

5 years ago

1.0.1

5 years ago

1.0.0

5 years ago