Buckets:

149 MB
6,599 files
Updated 13 days ago
Name
Size
development
directives
node
LICENSE1.52 kB
xet
README.md2.54 kB
xet
async-directive.d.ts7.91 kB
xet
async-directive.d.ts.map677 Bytes
xet
async-directive.js1.39 kB
xet
async-directive.js.map18.6 kB
xet
directive-helpers.d.ts5.04 kB
xet
directive-helpers.d.ts.map1.7 kB
xet
directive-helpers.js1.27 kB
xet
directive-helpers.js.map10.4 kB
xet
directive.d.ts2.56 kB
xet
directive.d.ts.map1.53 kB
xet
directive.js481 Bytes
xet
directive.js.map4.64 kB
xet
is-server.d.ts540 Bytes
xet
is-server.d.ts.map170 Bytes
xet
is-server.js162 Bytes
xet
is-server.js.map841 Bytes
xet
lit-html.d.ts25.1 kB
xet
lit-html.d.ts.map9.72 kB
xet
lit-html.js7.31 kB
xet
lit-html.js.map96.3 kB
xet
package.json20.2 kB
xet
polyfill-support.d.ts1.19 kB
xet
polyfill-support.d.ts.map187 Bytes
xet
polyfill-support.js2.14 kB
xet
polyfill-support.js.map14.4 kB
xet
private-ssr-support.d.ts3.06 kB
xet
private-ssr-support.d.ts.map942 Bytes
xet
private-ssr-support.js1.12 kB
xet
private-ssr-support.js.map6.51 kB
xet
static.d.ts3.57 kB
xet
static.d.ts.map940 Bytes
xet
static.js996 Bytes
xet
static.js.map7.81 kB
xet
README.md

lit-html

Efficient, Expressive, Extensible HTML templates in JavaScript

Build Status Published on npm Join our Discord Mentioned in Awesome Lit

lit-html is the template system that powers the Lit library for building fast web components.

When using lit-html to develop web components, most users should import lit-html via the lit package rather than installing and importing from lit-html directly.

Documentation

Full documentation is available at lit.dev/docs/templates/overview/.

Overview

lit-html lets you write HTML templates in JavaScript with template literals.

lit-html templates are plain JavaScript and combine the familiarity of writing HTML with the power of JavaScript. lit-html takes care of efficiently rendering templates to DOM, including efficiently updating the DOM with new values.

import {html, render} from 'lit-html';

// This is a lit-html template function. It returns a lit-html template.
const helloTemplate = (name) => html`<div>Hello ${name}!</div>`;

// This renders <div>Hello Steve!</div> to the document body
render(helloTemplate('Steve'), document.body);

// This updates to <div>Hello Kevin!</div>, but only updates the ${name} part
render(helloTemplate('Kevin'), document.body);

lit-html provides two main exports:

  • html: A JavaScript template tag used to produce a TemplateResult, which is a container for a template, and the values that should populate the template.
  • render(): A function that renders a TemplateResult to a DOM container, such as an element or shadow root.

Installation

$ npm install lit-html

Or use from lit:

$ npm install lit

Contributing

Please see CONTRIBUTING.md.

Total size
149 MB
Files
6,599
Last updated
Jun 23
Pre-warmed CDN
US EU US EU

Contributors