lit-xml

Burning your XML documents to the ground? Yes please. In the mean time, let's use lit-xml.

Usage no npm install needed!

<script type="module">
  import litXml from 'https://cdn.skypack.dev/lit-xml';
</script>

README

Lit XML πŸ”₯

Burning your XML documents to the ground? Yes please. In the mean time, let's use lit-xml.

A small utility to help construction of XML documents using a simple tagged template. Because you sometimes have to use XML πŸ€·β€β™€οΈ.

πŸ—ΊοΈ Installation

Install lit-xml locally within your project folder, like so:

npm i lit-xml

Or with yarn:

yarn add lit-xml

🎁 Usage

A simple example:

import { xml } from 'lit-xml';

const xmlFragment = xml`<foo bar="${41 + 1}">Some ${'<content>'}</foo>`.toString();
// => '<foo bar="42">Some &lt;content&gt;</foo>'

Importing xml will give you the default xml template literal. It will sanitize values, but not validate on well formed xml for performance reasons.

A more advanced scenario:

import { createLitXml } from 'lit-xml';
const xml = createLitXml({
  format: true,
  validators: [validators.isWellFormed],
  indent: 2
});


xml`<foo bar="${41 + 1}"><baz></baz></foo>`.toString();
// => `<foo bar="42">
//       <baz/> 
//     </foo>`

xml`<foo><foo>`.toString();
// InvalidXmlError! Error on line 1: Closing tag 'foo' is expected inplace of 'bar'. 

const people = [{ name: 'foo' }, { name: 'bar' }];
xml`<people>${people.map((p) => xml`<person>${p.name}</person>`)}</people>`.toString();
// => `<people>
//      <person>foo</person>
//      <person>bar</person>
//    </people>`

In this example, the createLitXml factory method is used to create a custom xml template literal. In this case it will validate that the XML document is well-formed and it will be formatted (with an indent of 2 spaces).

πŸš€ Features

🧩 Construct xml documents using plain JS like conditional operators and Array.prototype.map
πŸ’„ vscode plugin for syntax highlighting
🚿 Interpolated values are sanitized
πŸ“ Configurable well formed validation using fast-xml-parser
πŸ‘“ Configurable formatting output using fast-xml-parser

πŸ’­ Motivation

JavaScript is not-XML friendly. We're missing good libraries to construct larger XML documents without relying on template libraries like ejs or handlebars.

This library is an attempt to solve this problem using the simple feature of tagged templates. It is inspired by the awesome lit-html.