cli-spinner 官网
https://www.npmjs.com/package/cli-spinner
创建 cli-spinner 的演示项目
- 新建文件夹 cli-spinnerDemo
- 在 cli-spinnerDemo文件夹中打开命令行，执行
npm init -y
会自动生成 package.json
- 安装 cli-spinner
cnpm i cli-spinner
无 cnpm 的朋友先执行 npm i cnpm
- 在package.json中添加项目启动脚本
"start": "node index.js",
- 在 cli-spinnerDemo文件夹中新建文件 index.js 内容为
let Spinner = require("cli-spinner").Spinner; let spinner = new Spinner("processing.. %s"); spinner.setSpinnerString("|/-\\"); spinner.start();
- 启动项目
npm run start
效果如下
导入 cli-spinner
let Spinner = require("cli-spinner").Spinner;
使用 cli-spinner
自定义加载提示文字
let spinner = new Spinner("加载中.. %s");
配置加载特效
spinner.setSpinnerString("|/-\\");
加载特效通过循环遍历字符串 |/-\\ 实现，可以自定义为其他字符串。
启动加载
spinner.start();
停止加载
spinner.stop(true);
有参数 true 时，停止加载后，会清除加载提示文字，若无参数，则会保留加载提示文字
封装延时函数
为了看清加载特效，通常会延时1s左右再关闭加载特效，可使用以下函数实现
function sleep(timeout = 1000) { return new Promise((resolve) => setTimeout(resolve, timeout)); }
使用方式如下：
let Spinner = require("cli-spinner").Spinner; let spinner = new Spinner("加载中.. %s"); spinner.setSpinnerString("|/-\\"); (async function () { // 开启加载特效 spinner.start(); // 延时2s await sleep(2000); // 关闭加载特效; spinner.stop(true); })(); function sleep(timeout = 1000) { return new Promise((resolve) => setTimeout(resolve, timeout)); }
完整演示范例
let Spinner = require("cli-spinner").Spinner; let spinner = new Spinner("加载中.. %s"); spinner.setSpinnerString("|/-\\"); // 开启加载特效 spinner.start(); // 1s后关闭加载特效 setTimeout(() => { spinner.stop(true); }, 1000);
更多功能
可参考官网，或留言我来添加哈！
