You're viewing docs for an older version of Lit. Click here for the latest version.

Getting started

lit-html is distributed on npm, in the lit-html package.

You can also load lit-html directly from the CDN:

You can try out lit-html without installing anything using an online editor. Below are links to a simple lit-html starter project in some popular online editors:

lit-html is written in and distributed as standard JavaScript modules. Modules are increasingly supported in JavaScript environments and have shipped in Chrome, Firefox, Edge, Safari, and Opera.

To use lit-html, import it via a path:

The JavaScript import statement only works inside module scripts (<script type="module">), which can be inline scripts (as shown above) or external scripts.

The path to use depends on where you've installed lit-html. Browsers only support importing other modules by path, not by package name, so without other tools involved, you'll have to use paths.

If you use a tool that converts package names into paths, then you can import by package name:

For simplicity, the examples in these docs use package names (also known as node-style module specifiers).

See Tools for information on build tools and dev servers you can use to convert node-style module specifiers to browser-style module specifiers.

Why JavaScript modules? For more information on why lit-html is distributed using JavaScript modules, see JavaScript Modules.

lit-html has two main APIs:

  • The html template tag used to write templates.
  • The render() function used to render a template to a DOM container.

To learn more about templates, see Writing Templates.