ora 命令行加载动画
简介
ora 是一个用于命令行加载动画的库,它提供了简洁生动的动画效果,且支持自定义颜色、图标、文字等。
安装
bash
npm install orabash
pnpm add orabash
bun add ora使用
ora 的使用非常简单,只需要创建一个 Ora 实例,然后调用 start 和 stop(succeed, fail) 方法开启和停止动画即可。
以下是一个最简单的示例,展示了如何使用 ora 创建一个加载动画。
js
import ora from 'ora';
const spinner = ora('Loading').start();
setTimeout(() => {
spinner.succeed('Done');
}, 3000);配置选项
ora 提供了配置选项,可以自定义加载动画的颜色、图标、文字等。
ts
const spinner = ora({
text: 'Loading', // 显示的文字
color: 'red', // 颜色
spinner: 'dots', // 动画类型,默认值为 'dots'。支持自定义动画帧
});以下是 spinner 动画类型的配置项类型定义。
ts
export type Spinner = {
readonly frames: string[]; // 动画帧
readonly interval?: number; // 动画间隔
};ts
export type SpinnerName =
| 'dots'
| 'dots2'
| 'dots3'
| 'dots4'
| 'dots5'
| 'dots6'
| 'dots7'
| 'dots8'
| 'dots9'
| 'dots10'
| 'dots11'
| 'dots12'
| 'dots13'
| 'dots14'
| 'dots8Bit'
| 'dotsCircle'
| 'sand'
| 'line'
| 'line2'
| 'rollingLine'
| 'pipe'
| 'simpleDots'
| 'simpleDotsScrolling'
| 'star'
| 'star2'
| 'flip'
| 'hamburger'
| 'growVertical'
| 'growHorizontal'
| 'balloon'
| 'balloon2'
| 'noise'
| 'bounce'
| 'boxBounce'
| 'boxBounce2'
| 'binary'
| 'triangle'
| 'arc'
| 'circle'
| 'squareCorners'
| 'circleQuarters'
| 'circleHalves'
| 'squish'
| 'toggle'
| 'toggle2'
| 'toggle3'
| 'toggle4'
| 'toggle5'
| 'toggle6'
| 'toggle7'
| 'toggle8'
| 'toggle9'
| 'toggle10'
| 'toggle11'
| 'toggle12'
| 'toggle13'
| 'arrow'
| 'arrow2'
| 'arrow3'
| 'bouncingBar'
| 'bouncingBall'
| 'smiley'
| 'monkey'
| 'hearts'
| 'clock'
| 'earth'
| 'material'
| 'moon'
| 'runner'
| 'pong'
| 'shark'
| 'dqpb'
| 'weather'
| 'christmas'
| 'grenade'
| 'point'
| 'layer'
| 'betaWave'
| 'fingerDance'
| 'fistBump'
| 'soccerHeader'
| 'mindblown'
| 'speaker'
| 'orangePulse'
| 'bluePulse'
| 'orangeBluePulse'
| 'timeTravel'
| 'aesthetic'
| 'dwarfFortress';除了在创建 Ora 实例时配置选项,还可以直接修改 Ora 实例的属性。
ts
const spinner = ora()
spinner.text = 'Loading...';
spinner.color = 'green';
spinner.spinner ={
frames: [ "•", "-", "+", "*","*","*", "+", "-", "•"],
interval: 150
};链式调用
ora 支持链式调用,每个方法都会返回 Ora 实例。
ts
const spinner = ora('Loading');
spinner.stop("stop");
spinner.start("start");
spinner.indent(2); // 缩进2个空格
spinner.succeed("succeed");
spinner.fail("fail");
// 等价于
ora('Loading').stop("stop").start("start").indent(2).succeed("succeed").fail("fail");更多
更多用法请参考 ora 的官方文档。