Lit官方入门示例

陈拓 2023/12/17-2023/12/17

1. 简介

在《用Vite构建Lit项目》

https://blog.csdn.net/chentuo2000/article/details/134831884?spm=1001.2014.3001.5501

一文中我们介绍了怎样用Vite构建Lit项目。

本文我们介绍不依赖Vite的Lit入门示例。

我的开发环境还是和上文相同。

2. 官方入门示例

https://github.com/lit

2.1 js示例

• 下载示例

cd ~/lit/

git clone https://github.com/lit/lit-element-starter-js.git

• 安装依赖项

cd lit-element-starter-js

npm i

运行npm fund可用查看安装包的详细信息。

有8个漏洞（5个中等，3个高）。

运行npm audit查看漏洞详情。

最后几行蓝色部分提示npm可用升级，我的当前版本：

如无必要，不要升级。

• 运行示例

npm run serve

在浏览器上测试：

http://192.168.137.9:8000/

2.2 ts示例

• 下载示例

cd ~/lit/

git clone https://github.com/lit/lit-element-starter-ts.git

• 安装依赖项

cd lit-element-starter-ts

npm i

• 运行示例

npm run serve

在浏览器上测试：

http://192.168.137.9:8000/