# 基于 webpack5 构建的 js 工具库

支持 TypeScript；
支持输出多种模块化文件（UMD、CommonJS、ESM 等），便于引入使用；
支持按需加载（ESM Tree Shaking）；
支持自动化测试；

## Install

```sh
npm i webp5-js
#or
yarn add webp5-js
```

## Usage

```js
import calc from "webp5-js";

console.log(calc.add(1, 2));
this.img = await calc.urlToBase64(
  "https://xxx.com/ae79ac0b6b4b4974843910bcaeac643f.jpg"
);

// or 按需引入
import add from "webp5-js/es/add.esm";
import urlToBase64 from "webp5-js/es/urlToBase64.esm";

console.log(add(1, 2));
this.img = await urlToBase64(
  "https://xxx.com/ae79ac0b6b4b4974843910bcaeac643f.jpg"
);
```

## Image related events

| 事件名                       | 说明                                            | 参数                                      | 返回值      |
| :--------------------------- | :---------------------------------------------- | :---------------------------------------- | :---------- |
| getBase64Img(imgObj)         | 根据图片对象获取 base64 图片                    | imgObj（new Image()对象）                 | base64 图片 |
| urlToBase64(url)             | 网络图片转 base64 （new Image() + canvas 方式） | url（图片地址）                           | base64 图片 |
| getBase64ByUrl(url)          | 网络图片转 base64 （xhr + FileReader）          | url（图片地址）                           | base64 图片 |
| base64ToFile(data, fileName) | 将 base64 图片转成 file 对象                    | （data：base64 字符串, fileName：文件名） | file 对象   |
| urlToFile(url, imgName)      | 图片地址转 file 对象                            | （url：图片地址, imgName：图片名称）      | file 对象   |