shopify-liquid
A feature-rich Liquid implementation for Node.js, with compliance with Jekyll and Github Pages. See:
Installation:
npm install --save shopify-liquid
Render from String
Parse and Render:
var Liquid = ;var engine = ; engine ;
Caching templates:
var tpl = engine;engine ;
Render from File
var engine = ;engine ;// equivalent to: engine ;
cache
default to false
, extname
default to .liquid
, root
default to ""
.
Strict Rendering
Undefined filters and variables will be rendered as empty string by default. Enable strict rendering to throw errors upon undefined variables/filters:
var opts = strict_variables: true strict_filters: true;engine;engine;// Note: the below opts also work:// engine.render(tpl, ctx, opts)// engine.renderFile(path, ctx, opts)
Use with Express.js
// register liquid engineapp; app; // specify the views directoryapp; // set to default
There's an Express demo here.
Use in Browser
Download the dist files and import into your HTML.
And window.Liquid
is what you want.
There's also a demo.
Includes
// file: color.liquid
color: '{{ color }}' shape: '{{ shape }}'
// file: theme.liquid
{% assign shape = 'circle' %}
{% include 'color' %}
{% include 'color' with 'red' %}
{% include 'color', color: 'yellow', shape: 'square' %}
The output will be:
color: '' shape: 'circle'
color: 'red' shape: 'circle'
color: 'yellow' shape: 'square'
Layouts
// file: default-layout.liquid
Header
{% block content %}My default content{% endblock %}
Footer
// file: page.liquid
{% layout "default-layout" %}
{% block content %}My page content{% endblock %}
The output of page.liquid
:
Header
My page content
Footer
- It's possible to define multiple blocks.
- block name is optional when there's only one block.
Register Filters
// Usage: {{ name | uppper }}engine;
See existing filter implementations: https://github.com/harttle/shopify-liquid/blob/master/filters.js
Register Tags
// Usage: {% upper name%}engine;
See existing tag implementations: https://github.com/harttle/shopify-liquid/blob/master/tags/
Contribution Guide
- Make a fork.
- Write a test to demonstrate your feature is not supported yet.
- Optionaly, change source files to make all test pass.
- Create a pull request.