rivets-server

Render Rivets.js templates on the server.

Usage no npm install needed!

<script type="module">
  import rivetsServer from 'https://cdn.skypack.dev/rivets-server';
</script>

README

rivets-server

NPM version NPM dependencies Build Status

Render Rivets.js templates on the server. Let Rivets pick up again on the client, if you want.

An experiment in isomorphic JavaScript.

Advantages:

  • Friendly to search engines and browsers without JavaScript
  • Potential for faster "time-to-content" in mobile experience
  • Use the same templating language on client & server

By default, it currently uses my fork of Rivets, which supports restoring bindings from Rivets on the client-side, such as {text} bindings and empty if and each bindings. Vanilla Rivets can't currently persist or restore this information. See my pull request at: github.com/mikeric/rivets/pull/253

Conforms to the Consolidate.js API. Uses jsdom to run Rivets against templates.

Installation

  $ npm install rivets-server

Usage

It's easy!

var rivetsServer = require('rivets-server');
var template = '<span rv-text="name"></span>';
var locals = {
  name: 'Anders'
};
rivetsServer.render(template, locals, function (err, html) {
  // now, html == '<span rv-text="name">Anders</span>'
});

If you want to render a full HTML document, pass the fullDoc option as follows.

var rivetsServer = require('rivets-server');
var template = '<!doctype html><html><body>...</body></html>';
var locals = {
  options: {
    fullDoc: true
  }
};
rivetsServer.render(template, locals, function (err, html) { /* ... */ };

You may need to provide modified Rivets adapters. For example, if you have custom adapters for pub-sub on the client, but only have JSON models on the server, then you might want to alias all adapters to the default '.' adapter.

var rivetsServer = require('rivets-server');
// ...
var locals = {
  options: {
    configure: function (rivets) {
      rivets.adapters[':'] = rivets.adapters['.'];
    }
  }
};
rivetsServer.render(template, locals, function (err, html) { /* ... */ };