# @beatzball/litro 中文文档

规范地址：https://npmcn.com/package/%40beatzball/litro/

版本：0\.18\.0
npm 元数据更新时间：2026-11-04T16:50:57.419Z
中文译文更新时间：2026-11-07T21:50:57.562Z
软件包许可：Apache-2\.0

本文由上游 README 翻译，可能存在偏差，请结合原文核对 API、命令与配置。版权与许可归原作者所有。

原始 npm 页面：https://www.npmjs.com/package/%40beatzball/litro
原文对照：https://npmcn.com/package/%40beatzball/litro/?lang=original
项目主页：https://github.com/beatzball/litro#readme
源码仓库：https://github.com/beatzball/litro

## 关键信息（来自 npm 元数据）

- 包体积（解压后）：835 kB，306 个文件
- 模块格式：ES Module
- TypeScript 类型：包内自带
- 运行依赖：21 个
- peer 依赖：typescript ^5\.x，@elenajs/ssr ^1\.0\.0-alpha\.1，@elenajs/core ^1\.0\.0，@microsoft/fast-ssr ^1\.0\.0-beta\.1，@microsoft/fast-element ^2\.0\.0
- 首次发布：2026-03-09T07:38:20.155Z
- 最新版本发布：2026-11-04T16:50:57.062Z
- 近 30 天下载量：2358（2026-10-08 至 2026-11-06，npm 官方下载统计）
- 已发布版本数：38（近 12 个月 38 个）

## 中文简介

Fullstack网络框架用于网络组件——通过适配器选择Lit,FAST Element,或Elena. 基于文件的路由,流出SSR,SSG,和Nitro部署适配器. 基于标准的 Next.js / Nuxt.js 替代品 .

## 安装

```sh
npm install @beatzball/litro
```

也可以使用：`pnpm add @beatzball/litro`、`yarn add @beatzball/litro`、`bun add @beatzball/litro`

## README

# 升数

用于 [网络组件](https://developer.mozilla.org/en-US/docs/Web/API/Web_components),由 [硝基](https://nitro.unjs.io/)。 。 。 .

-   **框架适配器** 选择 [升](https://lit.dev/) (违约), [快速元素](https://www.fast.design/),或 [伊莲娜](https://elenajs.com/) 通过 `--adapter`
-   **基于文件的路由** —— 说 `pages/index.ts` → `/`, (中文(简体) ), `pages/blog/[slug].ts` → `/blog/:slug`
-   **精简安全部门改革** ——声明式影子DOM(Lit/FAST)或轻型DOM(Elena)
-   **客户水合** —— 说 `LitroRouter` (基于URLPattern)在SSR之后以无闪光器接管
-   **服务器数据获取** —— 说 `definePageData()` 在服务器上运行, 串行到客户端
-   **内容层** —— 说 `litro:content` markdown 博客的虚拟模块, 有 11ty 兼容的前题
-   **API 路线** - 简单 `server/api/` 使用 H3 处理器的文件
-   **Dev 一个端口** – Vite和Nitro共享一个单一的HTTP端口
-   **任何部署** - Node.js, Cloudflare工人,Vercel Edge,静态通过硝基适配器

* * *

## 快开始

```bash
# npm
npm create @beatzball/litro@latest my-app

# pnpm
pnpm create @beatzball/litro my-app

# yarn
yarn create @beatzball/litro my-app

# bun
bun create @beatzball/litro my-app

# deno
deno init --npm @beatzball/litro my-app
```

```bash
cd my-app
pnpm install
pnpm dev
```

* * *

## 哈罗世界

```typescript
// pages/index.ts
import { html } from 'lit';
import { customElement } from 'lit/decorators.js';
import { LitroPage } from '@beatzball/litro/runtime';
import { definePageData } from '@beatzball/litro';

export const pageData = definePageData(async () => ({
  message: 'Hello from the server!',
}));

@customElement('page-index')
export default class IndexPage extends LitroPage {
  override render() {
    const data = this.serverData as { message: string } | null;
    return html`<h1>${data?.message}</h1>`;
  }
}
```

* * *

## 如何比较

|  | 文学 | 下一个.js | 纳克特.js |
| --- | --- | --- | --- |
| 构成部分模式 | Lit / FAST / 伊莲娜 | 反应 | 阴道 |
| 基于文件的路由 | ✓ | ✓ | ✓ |
| 安保部门/特别支助组 | ✓ | ✓ | ✓ |
| 服务器引擎 | 硝基 | 自定义 | 硝基 |
| 你好,世界联署材料 | ~8kB 键 | ~90kB 时 | ~60kB 时 |
| 虚拟 DOM | —— 说 | ✓ | ✓ |
| W3C 标准计算 | ✓ | —— 说 | —— 说 |

> **关于Hello World JS数字的说明**:基于广泛引用的社区基准和已公布的框架文件的大致数字——不是该项目独立衡量的。 Lit 的~ 5 kB 运行时大小记录在 [已点出](https://lit.dev/)10\. 下个.js和Nuxt.js的数字反映了共同报告的JS最低限度有效载荷的基准,并因框架版本和配置而异.

* * *

## 道德操守办公室

Litro在将HTML发送到浏览器之前,先使所有页面服务器侧面——通过声明阴影DOM(Lit/FAST)或光DOM(Elena). 搜索引擎接收到全发内容——与Next.js和Nuxt.js使用的方法相同. 只有客户端的网络组件有SIO限制;Litro的SSSR默认消除了它们.

[这怎么行啊](https://litro.dev/docs/core-concepts/ssr)

* * *

## 文档

页:1 [立特罗.dev](https://litro.dev/)。 。 。 .

* * *

## 软件包

| 软件包 | 说明 |
| --- | --- |
| `@beatzball/litro` | 这一一揽子方案——核心框架 |
| [`@beatzball/litro-router`](https://www.npmjs.com/package/@beatzball/litro-router) | 独立的 URLPetern 路由器( 零依赖性) |
| `@beatzball/create-litro` | `npm create @beatzball/litro` 脚手架CLI—— `fullstack`, (中文(简体) ), `11ty-blog`, (中文(简体) ), `starlight`,以及 `supernova` 食谱 |

* * *

## 许可证

阿帕奇许可证2.0 — 版权2026 batzball.

## 常见问题

### @beatzball/litro 是什么？

Fullstack网络框架用于网络组件——通过适配器选择Lit,FAST Element,或Elena\. 基于文件的路由,流出SSR,SSG,和Nitro部署适配器\. 基于标准的 Next\.js / Nuxt\.js 替代品 \.

### 如何安装 @beatzball/litro？

在项目目录运行 npm install @beatzball/litro，或使用 pnpm add / yarn add / bun add。它还需要宿主项目提供 peer 依赖：typescript（^5\.x）。npm 7 及以上与 pnpm 8 及以上默认会自动安装必需的 peer 依赖，Yarn 需要手动安装。它还提供命令行工具 litro，可以用 npx litro 直接运行。

### @beatzball/litro 支持 TypeScript 吗？

支持。包内自带 TypeScript 类型声明（package\.json 声明了 types 入口），安装后即可获得类型提示，无需再安装 @types 包。

### @beatzball/litro 支持 ESM 还是 CommonJS？

以 ES Module 形式发布，推荐使用 import 引入。在 CommonJS 项目中，Node\.js 20\.19\+ / 22\.12\+ 可以直接 require\(\) 不含顶层 await 的 ES Module，更早的版本需要改用动态 import\(\)。

### @beatzball/litro 可以商用吗？

@beatzball/litro 使用 Apache-2\.0 许可。宽松许可：允许商业使用、修改和再分发，并附带明确的专利授权；分发时需保留许可与 NOTICE 文件，修改过的文件要注明改动。以上为概括，不构成法律意见，请以许可原文为准。

### @beatzball/litro 的下载量有多少？

根据 npm 官方下载统计，@beatzball/litro 在 2026/10/08 – 2026/11/06 这 30 天内被下载 2,358 次，日均约 79 次。下载量会把 CI 构建、镜像同步和作为其他包依赖的安装一并计入，适合横向比较热度，不能直接等同于使用人数。

### @beatzball/litro 还在维护吗？

最新版本 0\.18\.0 发布于 2026/11/05（3 天前）；至今共发布 38 个版本，其中过去 12 个月发布了 38 个；首次发布于 2026/03/09。发布频率只是参考信号：功能稳定的工具可能很少需要更新，建议结合源码仓库的 issue 和提交记录判断。