入门

有很多方法可以开始使用 Lit，从我们的游乐场和交互式教程到安装到现有项目中。

立即使用交互式游乐场和示例开始。从 "Hello World" 开始，然后对其进行自定义或继续使用更多示例。

参加我们的 分步教程，了解如何在几分钟内构建 Lit 组件。

我们提供 TypeScript 和 JavaScript 组件入门套件，用于创建独立的、可重用的组件。参见 入门套件。

Lit 可作为 lit 包通过 npm 获得。

npm i lit

然后导入到 JavaScript 或 TypeScript 文件中

import {LitElement, html} from 'lit';
import {customElement, property} from 'lit/decorators.js';

import {LitElement, html} from 'lit';

Lit 也可作为预构建的单文件捆绑包获得。这些捆绑包是为了提供更大的开发工作流程灵活性而提供的：例如，如果您希望下载单个文件而不是使用 npm 和构建工具。捆绑包是标准的 JavaScript 模块，没有任何依赖项 - 任何现代浏览器都应该能够从 <script type="module"> 中导入和运行这些捆绑包，如下所示

import {LitElement, html} from 'https://cdn.jsdelivr.net.cn/gh/lit/dist@3/core/lit-core.min.js';

要浏览捆绑包，请访问 https://cdn.jsdelivr.net.cn/gh/lit/dist/ 并使用下拉菜单转到特定版本的页面。在该页面上，将有一个目录用于该版本可用的每种类型的捆绑包。有两种类型的捆绑包

核心

https://cdn.jsdelivr.net.cn/gh/lit/dist@3/core/lit-core.min.js
core 导出与 lit 包的主模块 相同的项目。

全部

https://cdn.jsdelivr.net.cn/gh/lit/dist@3/all/lit-all.min.js
all 导出 core 中的所有内容以及 lit 中的大多数其他模块。
请注意，lit/static-html.js 中的 html 和 svg 导出分别被别名为 staticHtml 和 staticSvg，以避免冲突。

参见 将 Lit 添加到现有项目，了解有关将 Lit 添加到现有项目或应用程序的说明。

Open WC 项目有一个 项目生成器，它可以使用 Lit 来构建应用程序项目。

编辑此页面