How to use liquidjs - 10 common examples

To help you get started, weโ€™ve selected a few liquidjs examples, based on popular ways it is used in public projects.

Secure your code as it's written. Use Snyk Code to scan source code in minutes - no build needed - and fix issues immediately.

github xpack / xpm-js / lib / xpm / init.js View on Github external
author.name = gitConfig.user.name
      }
      if (gitConfig.user && gitConfig.user.email) {
        author.email = gitConfig.user.email
      }
    }
    liquidMap.author = author

    const currentTime = new Date()
    liquidMap.year = currentTime.getFullYear().toString()

    const templatesPath = path.resolve(this.rootAbsolutePath,
      'assets', 'sources')
    log.debug(`from='${templatesPath}'`)

    this.engine = new Liquid({
      root: templatesPath,
      cache: false,
      strict_filters: true, // default: false
      strict_variables: true, // default: false
      trim_right: false, // default: false
      trim_left: false // default: false
    })

    log.info(`Creating project '${liquidMap.projectName}'...`)

    await this.render('package.json.liquid', 'package.json', liquidMap)

    try {
      const readmePath = path.resolve(config.cwd, 'LICENSE')
      await fsPromises.access(readmePath)
github harttle / liquidjs / demo / express / app.js View on Github external
const express = require('express')
const { Liquid } = require('liquidjs')

const app = express()
const engine = new Liquid({
  root: __dirname, // for layouts and partials
  extname: '.liquid'
})

app.engine('liquid', engine.express()) // register liquid engine
app.set('views', ['./partials', './views']) // specify the views directory
app.set('view engine', 'liquid') // set to default

app.get('/', function (req, res) {
  const todos = ['fork and clone', 'make it better', 'make a pull request']
  res.render('todolist', {
    todos: todos,
    title: 'Welcome to liquidjs!'
  })
})
github BuilderIO / builder / packages / shopify / js / index.ts View on Github external
import { Context, Liquid as LLiquid } from 'liquidjs';

const liquid = new LLiquid();

liquid.registerFilter('money', value => {
  const str = String(value);
  // TODO: locales
  return '$' + str.slice(0, -2) + '.' + str.slice(-2);
});

const tempNoopFilters = ['img_url', 't'];
for (const tempNoopFilter of tempNoopFilters) {
  liquid.registerFilter(tempNoopFilter, value => value);
}

interface State {
  [key: string]: any;
}
github BuilderIO / builder / packages / shopify / js / index.ts View on Github external
get(str: string, state = this.state) {
    // TODO: better solution e.g. with proxies
    let useStr = str.replace(/selected_or_first_available_variant/g, 'variants[0]');
    // TODO: warn for errors
    return liquid.evalValueSync(useStr, new Context(state, undefined, true)) || '';
  }
github harttle / liquidjs / demo / nodejs / index.js View on Github external
const { Liquid } = require('liquidjs')

const engine = new Liquid({
  root: __dirname,
  extname: '.liquid'
})

engine.registerTag('header', {
  parse: function (token) {
    const [key, val] = token.args.split(':')
    this[key] = val
  },
  render: async function (scope, hash, emitter) {
    const title = await this.liquid.evalValue(this.content, scope)
    emitter.write(`<h1>${title}</h1>`)
  }
})

const ctx = {
github harttle / liquidjs / demo / typescript / index.ts View on Github external
import { Liquid, TagToken, Hash, Context, Emitter } from 'liquidjs'

const engine = new Liquid({
  root: __dirname,
  extname: '.liquid'
})

engine.registerTag('header', {
  parse: function (token: TagToken) {
    const [key, val] = token.args.split(':')
    this[key] = val
  },
  render: async function (context: Context, hash: Hash, emitter: Emitter) {
    const title = await this.liquid.evalValue(this['content'], context)
    emitter.write(`<h1>${title}</h1>`)
  }
})

const ctx = {
github BuilderIO / builder / packages / shopify / js / index.ts View on Github external
assign(str: string, state = this.state) {
    const re = /^\s*([^=\s]+)\s*=(.*)/;
    let useStr = str.replace(/selected_or_first_available_variant/g, 'variants[0]');
    const match = useStr.match(re)!;
    const key = match[1].trim();
    const value = match[2];
    const result = liquid.evalValueSync(value, new Context(state, undefined, true));
    console.debug('Liquid setting', key, 'to', result, 'via', str, state);
    state[key] = result;
  }
}
github Azure / api-management-developer-portal / src / services / templatingService.ts View on Github external
public static async render(template: string, model: Object): Promise {
        const engine = new Liquid();
        const result = await engine.parseAndRender(template, model, null);

        return result;
    }
}
github aiden / rpc_ts / src / site / index.ts View on Github external
async function generateTypeDocTemplates() {
  const engine = new Liquid({
    root: path.resolve(__dirname, '../../site'),
    extname: '.html',
  });

  const navbar = await engine.renderFile('common/partials/navbar.html', {
    page: { url: 'typedoc' },
  });
  fs.writeFileSync('site/typedoc/typedoc_theme/partials/header.hbs', navbar);

  const analytics = await engine.renderFile('common/partials/analytics.html');
  fs.writeFileSync(
    'site/typedoc/typedoc_theme/partials/analytics.hbs',
    analytics,
  );
}
github fomantic / create-fomantic-icons / src / tasks / BuildDist.ts View on Github external
return new Promise((resolve) => {
    Logger.log();
    const distSpinner = spinner()
      .start('building dist');

    const engine = new Liquid({
      root: resolvePath(__dirname, '../../src/templates'),
      extname: '.liquid',
    });

    const ctx: { [key: string]: any } = parseResults;
    ctx.version = results.asset.version;

    const distFiles: { [key: string]: string } = {
      'icon.html.eco': 'docs/server/documents/elements/',
      'icon.overrides': 'ui/src/themes/default/elements/',
      'icon.variables': 'ui/src/themes/default/elements/',
    };

    const templateFileRenderFuncs = Object.keys(distFiles)
      .map(filename => new Promise((resolveRender, rejectRender) => {
        engine.renderFile(`${filename}.liquid`, ctx)

liquidjs

A simple, expressive and safe Shopify / Github Pages compatible template engine in pure JavaScript.

MIT
Latest version published 1 month ago

Package Health Score

86 / 100
Full package analysis

Popular liquidjs functions