dctoon/liquidjs

A shopify compatible Liquid template engine in pure JavaScript.

liquidjs

A shopify compatible Liquid template engine in pure JavaScript. The purpose of this repo is to provide a standard Liquid implementation for the JavaScript community. All features, filters and tags in shopify/liquid are supposed to be built in LiquidJS, though there are still some differences and limitations (see below).

Donate to our collective if you like liquidjs.

Get Started

Install via npm:

npm install --save liquidjs

var Liquid = require('liquidjs');
var engine = new Liquid();

engine
    .parseAndRender('{{name | capitalize}}', {name: 'alice'})
    .then(console.log);     // outputs 'Alice'

Or include the UMD build (You may need a Promise polyfill for Node.js < 4 and ES5 browsers like IE and Android UC):

<script src="//unpkg.com/liquidjs/dist/liquid.min.js"></script>     <!--for production-->
<script src="//unpkg.com/liquidjs/dist/liquid.js"></script>         <!--for development-->

Also available from CLI:

echo '{{"hello" | capitalize}}' | npx liquidjs

• A live demo is available on jsfiddle: https://jsfiddle.net/6u40xbzs/
• For more tutorials and the full API, refer to the wiki page.
• Typedoc is also available here: https://harttle.github.io/liquidjs/classes/_liquid_.liquid.html

Differences and Limitations

• Dynamic file locating (enabled by default), that means layout/partial names are treated as variables in liquidjs. See #51.
• Truthy and Falsy. All values except undefined, null, false are truthy, whereas in Ruby Liquid all except nil and false are truthy. See #26.
• Number. In JavaScript we cannot distinguish or convert between float and integer, see #59. And when applied size filter, numbers always return 0, which is 8 for integer in ruby, cause they do not have a length property.
• .to_liquid() is replaced by .toLiquid()
• .to_s() is replaced by JavaScript .toString()

Features that available on shopify website but not on shopify/liquid repo will not be implemented in this repo, but there're some plugins available (feel free to add yours):

• color filters: https://github.com/harttle/liquidjs-color-filters
• sections tags (WIP): https://github.com/harttle/liquidjs-section-tags

Contributors ✨

This project follows the all-contributors specification. Contributions of any kind are welcome! Thanks goes to these wonderful people:

Jun Yang 🚧 💻	chenos 💻	Zach Leatherman 🐛	Tim Hardy 💻	Paul Robert Lloyd 💻 🐛	Alec Larson 💻	Patrick Malouin 💻 📖
jaswrks 💻	三三 💻 🤔	ssendev 💻 📖	wojtask9 💻	Andrew Barclay 💻	Cory Mawhorter 💻	Mehdi Jaffery 💻
Robin Bijlani 💻 🐛	Ryan Kennedy 💻	Sami Kukkonen 💻	Scott Santucci 💻	Steven 💡 💻	azu 📖