# dazi

> 使用 js 实现打字效果

Latest version **1.0.4** (published 2023-02-02) · MIT license · 0 weekly downloads

## Install

```sh
npm install dazi
pnpm add dazi
yarn add dazi
bun add dazi
```

## Health

**Score 15/100 (F)** — status: abandoned.

Positive: no vulnerabilities.

Warnings: low downloads; no types; no esm support.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 1.0.4 |
| Published | 2023-02-02 |
| First published | 2023-02-01 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | none |
| Module format | CommonJS |
| Dependencies | 0 |
| Unpacked size | 42.3 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| Maintainers | laowan |
| Keywords | 打字效果 |

## Links

- npm: https://www.npmjs.com/package/dazi
- Repository: https://gitee.com/laowans/dazi
- npm.io page: https://npm.io/package/dazi

## Recent versions

- 1.0.4 (latest) — 2023-02-02
- 1.0.2 — 2023-02-02
- 1.0.1 — 2023-02-01

## README

## 简介

dazi.js 顾名思义一个实现打字效果的包，包提供三种导入方式全局导入、ES6 的 import 和 CommonJS 的 require。

### 文件说明

在 lib 目录下有6个文件分别对应着全局、ES6 和 CommonJS 导入方式的文件

其中文件名带有

- global：代表全局导入，直接在 window 对象的 _dazi 属性中，可直接通过script标签导入
- es：代表遵循了 ES6 的暴露方式，可通过 import 导入
- cjs：代表遵循了 CommonJS 的暴露方式，可通过 require导入

> ES6 和 CommonJS 的暴露方式均为默认暴露
>
> 文件名带有 min 就代表经过了压缩，代码的体积会更小
>
> 默认导入的是 es.min.js

## 使用

```js
import dazi from 'dazi';

const dom = document.getElementById('text');

// 第一个参数为要执行打字的效果的dom
// 第二个参数为配置的项
new dazi(dom, {
    text:[
        'hello JavaScript!',
        'hello world!'
    ]
})
```

### 配置项：

| 参数              | 说明                                                         | 类型          | 可选值            | 默认值 |
| ----------------- | ------------------------------------------------------------ | ------------- | ----------------- | ------ |
| text              | 要展示的文字                                                 | string/array  | -                 | -      |
| showCursor        | 是否展示光标                                                 | boolean       | -                 | true   |
| cursorFlickerTime | 光标闪烁周期时间                                             | number        | -                 | 1000   |
| backtrack         | 是否回溯                                                     | boolean       | -                 | true   |
| speed             | 打字速度                                                     | number        | -                 | 100    |
| pauseTime         | 停顿时间                                                     | number        | -                 | 3000   |
| deleteSpeed       | 文字删除速度                                                 | number        | -                 | 30     |
| mode              | 输出模式（循环/随机/单次）                                   | string        | cycle/random/once | cycle  |
| once_backtrack    | 在单次输出模式下，最后一次输出是否回溯                       | boolean       | -                 | true   |
| once_showCursor   | 在单次输出模式下，最后一次输出完后光标是否展示               | boolean       | -                 | true   |
| random_first      | 在随机输出模式下，第一次输出的内容(数字表示 text 配置项为数组的情况下的索引) | string/number | -                 | -      |

> 注意：mode 为 random 时，需要 text 为数组且长度大于2

## 提示：

**此包刚写出来，没有在各个浏览器和各个版本的浏览测试过，请谨慎使用。**

## 开发趣事

1. 刚开始本来想叫 typing.js 的，结果我去 npm 一搜有已经有了，去看了他个那个演示页面，他那个怎么说呢，属实nb！，真的，后来一想这要是一搜我这个和他的同时出来，一对比还是有点那啥，所以我果断改名。
2. 我想应该会有人想为什么我会还弄个使用 CommonJS 暴露的文件，这个呢是因为我写了一个自动化打包的文件，本来没想加上的，后来一想，万一以后用得到呢，到时候要用了，copy 一下就好了，还得加上，反正多个循环的事吗

---
_Source: https://npm.io/package/dazi · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._