# @badrap/bar-of-progress 中文文档

规范地址：https://npmcn.com/package/%40badrap/bar-of-progress/

版本：0\.3\.0
npm 元数据更新时间：2025-08-04T16:46:27.053Z
中文译文更新时间：2026-11-07T14:43:08.170Z
软件包许可：MIT

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

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

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

- 包体积（解压后）：19.1 kB，10 个文件
- 模块格式：ESM + CJS
- TypeScript 类型：包内自带
- 运行依赖：0 个
- 首次发布：2019-04-12T11:27:04.563Z
- 最新版本发布：2025-08-04T16:46:26.592Z
- 近 30 天下载量：27301（2026-10-08 至 2026-11-06，npm 官方下载统计）
- 已发布版本数：9（近 12 个月 0 个）

## 中文简介

一个小型的简单零依赖性进度栏组件.

## 安装

```sh
npm install @badrap/bar-of-progress
```

也可以使用：`pnpm add @badrap/bar-of-progress`、`yarn add @badrap/bar-of-progress`、`bun add @badrap/bar-of-progress`

## README

# 进展 [![CI](https://github.com/badrap/bar-of-progress/actions/workflows/ci.yml/badge.svg)](https://github.com/badrap/bar-of-progress/actions/workflows/ci.yml) [![npm](https://img.shields.io/npm/v/@badrap/bar-of-progress.svg)](https://www.npmjs.com/package/@badrap/bar-of-progress)

一个小型的简单零依赖性进度栏组件.

![](https://user-images.githubusercontent.com/19776768/56576324-b40f1100-65d0-11e9-8332-37411ed01bd8.gif)

## 特征

-   **零依赖关系**: 也不特别与任何框架挂钩.
-   **小型**: < 500 字节与 Brotli ( < 600 字节 gziped) .
-   **易于使用**(笑声) (掌声) (掌声) (掌声) (掌声) (掌声) (掌声) (掌声) (掌声) (掌声) (掌声) 而TypeScript类型现在也可用了!

> \[注\] 我们认为这个套装是完成的, 因此我们不接受任何新的功能要求或建议。 请使用问题跟踪器来获取错误报告和安全问题,我们高度重视和欢迎这些问题。 谢谢你的理解

## 安装

```sh
$ npm i @badrap/bar-of-progress
```

## 使用量

导入软件包并创建进度栏实例 :

```js
import ProgressBar from "@badrap/bar-of-progress";

const progress = new ProgressBar();
```

显示进度栏并开始动画 `.start()` 方法.

```js
progress.start();
```

> **说明** 默认情况下,当 `.start()` 名为. 相反,有一个80毫秒的宽限期,允许非常快地完成的任务来避免显示进度栏. 您可以修改此( 和其他) 行为, 查看 [自定义](https://npmcn.com/package/%40badrap/bar-of-progress/#readme-customization)。 。 。 .

通过调用 `.finish()` 方法 :

```js
setTimeout(() => {
  progress.finish();
}, 1000);
```

你可以重用一个 `progress` 实例多次 - 每次 `.start()` 被称为进步栏 从零开始动画.

## 自定义

进步栏的外观和行为可以(略)以构造参数定制. 以下是不同的选项及其默认值:

```js
const progress = new ProgressBar({
  // The size (height) of the progress bar.
  // Numeric values get converted to px.
  size: 2,

  // Color of the progress bar.
  // Also used for the glow around the bar.
  color: "#29e",

  // Class name used for the progress bar element.
  className: "bar-of-progress",

  // How many milliseconds to wait before the progress bar
  // animation starts after calling .start().
  delay: 80,
});
```

## 许可证

这个图书馆根据麻省理工学院的许可证颁发执照. 见 [自由主义](https://npmcn.com/package/%40badrap/bar-of-progress/LICENSE)。 。 。 .

## 常见问题

### @badrap/bar-of-progress 是什么？

一个小型的简单零依赖性进度栏组件\.

### 如何安装 @badrap/bar-of-progress？

在项目目录运行 npm install @badrap/bar-of-progress，或使用 pnpm add / yarn add / bun add。

### @badrap/bar-of-progress 支持 TypeScript 吗？

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

### @badrap/bar-of-progress 支持 ESM 还是 CommonJS？

同时提供 ES Module 与 CommonJS 入口，import 和 require\(\) 都可以使用，打包工具会自动选择合适的版本。

### @badrap/bar-of-progress 可以商用吗？

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

### @badrap/bar-of-progress 的下载量有多少？

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

### @badrap/bar-of-progress 还在维护吗？

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