# create-base-sprite

> Combine icons to generate sprites.

Latest version **1.0.6** (published 2022-04-02) · ISC license · 0 weekly downloads

## Install

```sh
npm install create-base-sprite
pnpm add create-base-sprite
yarn add create-base-sprite
bun add create-base-sprite
```

## 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.6 |
| Published | 2022-04-02 |
| First published | 2022-03-29 |
| Weekly downloads | 0 |
| License | ISC |
| TypeScript types | none |
| Module format | CommonJS |
| Dependencies | 3 |
| Unpacked size | 11.2 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| Author | libaba2 |
| Maintainers | libaba2 |
| Keywords | sprite, icons |

## Links

- npm: https://www.npmjs.com/package/create-base-sprite
- npm.io page: https://npm.io/package/create-base-sprite

## Dependencies (3)

- [canvas](https://npm.io/package/canvas.md) ^2.9.1
- [canvassmith](https://npm.io/package/canvassmith.md) ^1.6.0
- [spritesmith](https://npm.io/package/spritesmith.md) ^3.4.0

## Alternatives

- [@fortawesome/react-fontawesome](https://npm.io/package/@fortawesome/react-fontawesome.md) — 2.2M weekly downloads
- [roboto-fontface](https://npm.io/package/roboto-fontface.md) — 196.0K weekly downloads
- [@react-native-vector-icons/common](https://npm.io/package/@react-native-vector-icons/common.md) — 150.4K weekly downloads
- [@procore/core-icons](https://npm.io/package/@procore/core-icons.md) — 4.6K weekly downloads
- [@react-md/material-icons](https://npm.io/package/@react-md/material-icons.md) — 1.6K weekly downloads

## Recent versions

- 1.0.6 (latest) — 2022-04-02
- 1.0.5 — 2022-04-02
- 1.0.4 — 2022-03-29
- 1.0.3 — 2022-03-29
- 1.0.2 — 2022-03-29
- 1.0.1 — 2022-03-29

## README

#### 说明
***
对 **spritesmith**包进行二次封装，在此基础上添加了些自定义参数
#### 使用
> * npm install create-base-sprite
> * 引入 create-base-sprite，创建对象。注入config
> * 调用`runCreate(小图标源路径)`

#### congfig配置选项
> * ` const CONFIG = {`
> * `outputDir: __dirname + "/output/", // 输出路径`
> * `spriteImageName: "sprite.png", // 合成sprite图片名`
> * `spriteImageJSON: "sprite.json", // 输出icon信息json文件名`
> * `spriteImageCSS: "sprite.css",  // 输出css样式文件名`
> * `cssImagePrefix: "icons-", // 样式前缀`
> * `isOutputTreeJson: false, // 是否输出icon信息文件`
> * `unit: "px" // 单位 可选px/vw` 
> * `}; `

#### 示例
> * `var Cbsprite = require('create-base-sprite').createSprite`
> * `var csprite = new Cbsprite(CONFIG)`
> * `csprite.runCreate('./images')`

#### 注意
* `runCreate(url)`该方法会搜集url路径下所有（包括二级、三级文件夹下）小图标
* 二次执行会覆盖上一次输出生成的对应文件
* 若出现`canvas`或者`canvassmith`包安装错误，请先安装cnpm并使用淘宝镜像`npm install -g cnpm --registry=http://registry.npm.taobao.org `，再进行`cnpm install`。

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