安装和使用

如果你还不了解 Liquid 模板语言，请参考 Liquid 模板语言简介。

在 Node.js 里使用

通过 NPM 安装：

npm install --save liquidjs

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

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

示例

这里有一个 LiquidJS 在 Node.js 里使用的例子：liquidjs/demo/nodejs/.

LiquidJS 的类型定义也导出并发布到了 NPM 包里，写 TypeScript 的项目可以直接这样使用：

import { Liquid } from 'liquidjs';
const engine = new Liquid();

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

示例

这里有一个 LiquidJS 在 TypeScript 下的例子：liquidjs/demo/typescript/.

在浏览器里使用

LiquidJS 预先构建了 UMD Bundle，可以通过 jsDelivr CDN 来引用：

<script src="https://cdn.jsdelivr.net/npm/liquidjs/dist/liquid.browser.min.js"></script>     <!--生产环境-->
<script src="https://cdn.jsdelivr.net/npm/liquidjs/dist/liquid.browser.umd.js"></script>         <!--开发环境-->

示例

这里有一个 jsFiddle 上的在线例子：jsfiddle.net/x43eb0z6，其源码也可以在 liquidjs/demo/browser/ 找到。

兼容性

在类似 IE 和 Android UC 这样的浏览器中，你可能需要引入 Promise polyfill，参看 caniuse 的统计。

在命令行里使用

你还可以在命令行里使用 LiquidJS：

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

模板来自标准输入，数据则来自参数，这个参数可以是一个 JSON 文件的路径，也可以是一个 JSON 字符串：

echo 'Hello, {{ name }}.' | npx liquidjs '{"name": "Snake"}'

其他

@stevenanthonyrevo 还提供了一个 ReactJS demo，请参考 liquidjs/demo/reactjs/。