# @cssints/balance 中文文档

规范地址：https://npmcn.com/package/%40cssints/balance/

版本：0\.35\.1
npm 元数据更新时间：2026-11-07T14:55:50.865Z
中文译文更新时间：2026-11-11T03:24:58.209Z
软件包许可：MIT

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

原始 npm 页面：https://www.npmjs.com/package/%40cssints/balance
原文对照：https://npmcn.com/package/%40cssints/balance/?lang=original
项目主页：https://cssints.dev/
源码仓库：https://github.com/alexeiaccio/css-in-ts-compiler

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

- 包体积（解压后）：10.6 kB，7 个文件
- 模块格式：ES Module
- TypeScript 类型：包内自带
- Node.js 要求：\>=22
- 运行依赖：0 个
- peer 依赖：cssints ^0\.35\.0
- 首次发布：2026-10-10T20:57:54.023Z
- 最新版本发布：2026-11-07T14:55:50.498Z
- 近 30 天下载量：7212（2026-10-11 至 2026-11-09，npm 官方下载统计）
- 已发布版本数：42（近 12 个月 42 个）

## 中文简介

文本- wrap: cssints 的平衡和漂亮, 包含一个在浏览器中平衡行而不用文本- wrap: 平衡的脚本

## 安装

```sh
npm install @cssints/balance
```

也可以使用：`pnpm add @cssints/balance`、`yarn add @cssints/balance`、`bun add @cssints/balance`

## README

# @ cssints/ 余额

`text-wrap: balance` 财务报告和审定财务报表 `text-wrap: pretty` 页:1 [点缀](https://npmcn.com/package/README.md)成员 `cssints/plugin` `scope()`。 。 。 . `css.textWrap("balance")` 已经给出了本地特性; 此软件包添加的是倒置: 对于浏览器列表 目标 `text-wrap: balance` (碱性催化分解) `css.properties.text-wrap.balance`:Chrome 114, Firefox 121, Safari 17.5), 互联网档案馆的存檔,存档日期2013-12-20, a 0.55 kB 脚本平衡行道 [时间/文本平衡器](https://github.com/nytimes/text-balancer) 财务报告和审定财务报表 [反应- wrap- 平衡器](https://github.com/shuding/react-wrap-balancer) 来.

```ts
import { cn, fontSize } from "cssints" with { type: "cssints" };
import { balance, pretty } from "@cssints/balance" with { type: "cssints" };

export const title = cn(balance(), fontSize("2rem"));
export const lead = pretty();
```

```css
@layer _.k {
  ._balance-core {
    text-wrap: balance;
  }
  ._balance-prettyCore {
    text-wrap: pretty;
  }
  /* only when a target lacks text-wrap: balance */
  @supports not (text-wrap: balance) {
    ._balance-core {
      --balance-js: 1;
    }
  }
}
```

## 浏览器

-   **土著**数字 : `text-wrap: balance` 在Chrome 114、Firefox 121、Safari 17.5中; `text-wrap: pretty` 在Chrome 117和 Safari 26号,不在Firefox.
-   **运行时间** 覆盖每个浏览器 `ResizeObserver` (Chrome 64, Firefox 69, Safari 13.1). `bun run test:browsers` 在Chrome, Firefox 和 WebKit 中检查, 本地和本地特性关闭: 脚本 给出与浏览器相同的行.

## 规则

-   **`balance()`** 是一个内核写成样式, `css.textWrap("balance")`,并有一个运行时间条目 `css.properties.text-wrap` 财务报告和审定财务报表 `css.properties.text-wrap.balance`,它涵盖了内核的支持警告。 当a 目标缺少它,工作表得到上述倒置规则: `--balance-js: 1` 内部 `@supports not (text-wrap: balance)`, (中文(简体) ), 所以它只在一个没有特性的浏览器, 和使用模块 `balance()` 将脚本导入到 `virtual:cssints/runtime/balance.script` (运行时的条目命名它, `script`) (中文(简体) ). 当每个目标都拥有它时 规则或脚本船:运行时模块为空。 无论是哪种方式,都无支持警告,也无任何手工导入.
-   **运行时间** (单位:千美元)`@cssints/balance/runtime`,没有进口,552个字节已变更和被子化)对一个类别要素采取行动 `_balance-core` 他们的计算 `--balance-js` 设置: 二进制搜索最窄 `max-width` (半数之间) 宽度和所有宽度),保持了元素的高度,所以行数会保持并平出行. 又开始运行了 当元素的父大小调整时( q)`ResizeObserver`),当其文本更改时,当添加了标记元素时 (单位:千美元)`MutationObserver`),当字体准备好时.
-   **`pretty()`** 实值 `text-wrap: pretty` 并且没有更多的。 没有小的多填:相当重整段 避免孤儿和被打乱的边缘, 和没有它包装的浏览器 与往常一样, 这是相当改善。 就这样 不需要任何东西, 警告什么也没有 `css.textWrap("pretty")` 你应当为Firefox而警告 它的内核是原始的CSS, `&{text-wrap:pretty}`,因为没有什么可以掩盖 一种写作风格的警告.
-   **冲突.** 两套 `text-wrap`(单位:千美元) `cn()` 持有其中之一 `text-wrap*` 或者说 `white-space` 是一个建筑 错误. `balance()`'是源于它的内核, `cssints: balance: kernel core sets text-wrap (this style also sets text-wrap)`· ; `pretty()`生的内核不产生,所以一个条目列出它们: `cssints: balance: it sets text-wrap (this style also sets text-wrap-style)`。 。 。 .

## 限制

-   **没有条件.** 成员是内核的类,全球CSS,不能附加条件: `hover(pretty())` 或者说 `media(...)(balance())` 调用时的构建错误( i) :`:hover wraps _balance-prettyCore, the marker of kernel balance.prettyCore, with no declaration of its own`) (中文(简体) ). 在某种条件下,使用 `css.textWrap(...)` (仅限本土).
-   **倒计时 `max-width`** 框中收窄,其中 `text-wrap: balance` 留着吧 居中文本 需求 `margin-inline: auto` 以元素为中心。 内含 `max-width` 由您自己覆盖.
-   水平写入模式; 父程序不能从元素中大小( 缩写到适应的父程序可以循环) 与 `ResizeObserver`) (中文(简体) ).

```bash
cd packages/balance && bun run test            # fixtures through the engine (kernel, fallback CSS by target, conflict)
cd packages/balance && bun run typecheck       # and the type test
cd packages/balance && bun run test:browsers   # Chrome, Firefox and WebKit through playwright-core
```

## 贷项

这个想法是 [时间/文本平衡器](https://github.com/nytimes/text-balancer) (Apache-2.0,纽约时报) 公司)和 [反应- wrap- 平衡器](https://github.com/shuding/react-wrap-balancer) (麻省理工学院,舒鼎):找到最窄的 宽度,通过二进制搜索来保留行数,当父重排大小时。 剧本在这里写; 不 代码被复制.

## 常见问题

### @cssints/balance 是什么？

文本- wrap: cssints 的平衡和漂亮, 包含一个在浏览器中平衡行而不用文本- wrap: 平衡的脚本

### 如何安装 @cssints/balance？

在项目目录运行 npm install @cssints/balance，或使用 pnpm add / yarn add / bun add。它还需要宿主项目提供 peer 依赖：cssints（^0\.35\.0）。npm 7 及以上与 pnpm 8 及以上默认会自动安装必需的 peer 依赖，Yarn 需要手动安装。

### @cssints/balance 支持 TypeScript 吗？

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

### @cssints/balance 支持 ESM 还是 CommonJS？

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

### @cssints/balance 需要什么版本的 Node\.js？

package\.json 的 engines 字段要求 Node\.js \>=22。版本不符时 npm 默认只给出警告，开启 engine-strict 后会拒绝安装。

### @cssints/balance 可以商用吗？

@cssints/balance 使用 MIT 许可。宽松许可：允许商业使用、修改和再分发，通常只需在分发时保留原版权与许可声明。以上为概括，不构成法律意见，请以许可原文为准。

### @cssints/balance 的下载量有多少？

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

### @cssints/balance 还在维护吗？

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