Tplit
A simple, small, fast, all-purpose templating engine using the power and flexibility of native JavaScript template literals.
Environment and browser support
Node | ES Module | Browser | UMD | CLI |
---|---|---|---|---|
✓ | ✓ | x | ✓ | x |
Install
npm i -D @brikcss/tplit
Usage
There are two ways to use tplit, each has their pros and cons:
-
Pass a string (most flexible):
import tplit from "@brikcss/tplit"; // Syntax: tplit(template = '', options = {})(context = {}) tplit("Hello ${this.name}")({ name: "World" }); // console.log(compiled) => 'Hello World'
-
Call with template literal function (least flexible but allows outside context):
import { tplitReduce } from "@brikcss/tplit"; const name = "World"; // Syntax: tplitReduce((map = arg => arg))`Hello ${name}`; const compiled = tplitReduce( (map = arg => arg.toUpperCase()) )`Hello ${name}`; // console.log(compiled) => 'Hello WORLD'
Options
-
prop
{String
} (this
): Property to use for context Object. Note: Not available when calling tplit as a template literal. -
split
{Boolean
} (false
): Whether to split the template and return an Array of[chunks, ...values]
. This would allow you to further manipulate the template as desired. Note: Not available when calling tplit as a template literal. -
map
{Function
} ((value, key, context) => value
): Function to manipulate template values. This would allow you to, for example, sanitize HTML or otherwise manipulate context values.
Examples
For examples, see the tests.