# easy-tinypng-new-cli

**Repository Path**: jqClub/easy-tinypng-new-cli

## Basic Information

- **Project Name**: easy-tinypng-new-cli
- **Description**: easy-tinypng-new-cli改进版
- **Primary Language**: Unknown
- **License**: MIT
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 0
- **Forks**: 0
- **Created**: 2024-04-22
- **Last Updated**: 2024-09-03

## Categories & Tags

**Categories**: Uncategorized

**Tags**: 压缩图片

## README

# easy-tinypng-new-cli

A cli can automatically compress images with [tinypng.com.](https://tinypng.com/)

[![NPM version](https://badge.fury.io/js/easy-tinypng-new-cli.png)](https://www.npmjs.com/package/easy-tinypng-new-cli)


<p align='center'>
<img src='https://cdn.staticaly.com/gh/sudongyuer/image-bed@master/20220731/easy-tinypng-new-cli.png?raw=true' width='200'/>
</p>

## Why

When delevoping a website, we often need to `compress` `images` to reduce the `network io` cast.In normal way, we may need four steps to compress images: 
1. download images from the internet
2. upload the image to [tinypng.com](https://tinypng.com/)  
3. download the compressed image from [tinypng.com](https://tinypng.com/)  
4. copy the compressd images into our workspace

The above steps are very time-consuming. So !!! this `cli` can automatically compress images in background process. It will watch the fileSystem changes to auto handle if there are any images that need to be compressed.

## 🚀 Features

- 💾 Support configuration file
- 🍁 Multiple directory watching
- ✨ Support HMR
- 🦋 Auto detection nested directory images and compress them
- 🌝 Background process will not block the main thread
- 🐻‍❄️ Compressed record logging to avoid repeated compression

<p align="center">
<img src="https://cdn.staticaly.com/gh/sudongyuer/image-bed@master/20220731/easy-tinypng-new-cli-preview.xkrdjpi00ao.gif?raw=true" alt="vite-plugin-vue-inspector">
</p>

## Usage

### 发布

```ball
##先切换npm源
nrm use npm
npm run release
```

### Install

```ball
pnpm add -D easy-tinypng-new-cli
```

### Config `tiny.config.ts`

- APIKey (required) : the API key of [tinypng.com](https://tinypng.com/), you can get it from [tinypng.com](https://tinypng.com/)

- targetDir (required) : the top directory that you want to compress images


```js
import { defineTinyConfig } from 'easy-tinypng-new-cli/utils'

export default defineTinyConfig({
  configs: [
    {
      targetDir: './src/images',
    },
  ],
  APIKey: 'xxxxxxxxx',
})

```
### Add Script in `package.json`

```js
{
  "scripts": {
    "optimizeImages": "tiny"
  }
}
```
or
```js
{
  "scripts": {
    "optimizeImages": "tiny --once" //only compress once no watching files change
  }
}
```

## Author

sudongyuer email:976499226@qq.com

## License

[MIT](./LICENSE) License © 2021 [SuDongYu](https://gitee.com/jqClub)