# @dingdaoos/lucid-icons

> Lucid SVG icons

Latest version **1.0.2** (published 2022-08-01) · BSD license · 0 weekly downloads

## Install

```sh
npm install @dingdaoos/lucid-icons
pnpm add @dingdaoos/lucid-icons
yarn add @dingdaoos/lucid-icons
bun add @dingdaoos/lucid-icons
```

## 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.2 |
| Published | 2022-08-01 |
| First published | 2022-06-20 |
| Weekly downloads | 0 |
| License | BSD |
| TypeScript types | none |
| Module format | CommonJS |
| Node | >= 14.0.0 |
| Dependencies | 0 |
| Unpacked size | 1.4 MB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| Author | Dingdao PWA Runtime |
| Maintainers | zhanglibin8, boxup, dingdaoos-owner |
| Keywords | components, icon |

## Links

- npm: https://www.npmjs.com/package/@dingdaoos/lucid-icons
- npm.io page: https://npm.io/package/@dingdaoos/lucid-icons

## 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
- [stockfish](https://npm.io/package/stockfish.md) — 27.0K weekly downloads
- [@procore/core-icons](https://npm.io/package/@procore/core-icons.md) — 4.6K weekly downloads

## Recent versions

- 1.0.2 (latest) — 2022-08-01
- 1.0.0-beta.2 — 2022-07-21
- 1.0.0-beta.1 — 2022-07-20
- 1.0.0-beta.0 — 2022-06-20
- 1.0.0-beta — 2022-06-20

## README

<img src="https://lucent.dev.dingdaoos.com/img/lucent-logo-hw.d89c92eb.png" style="width: 200px" />
<br />
<br />
A DingOS Web UI Components Library for Vue 2.x
<br />
<br />
<img src="https://img.shields.io/badge/npm-v0.2.1-brightgreen" /> 
<img src="https://img.shields.io/badge/License-BSD-yellowgreen" /> 
<img src="https://img.shields.io/badge/backers-636-brightgreen" />

### How to use

#### 全局引用

```javascript
npm install -S @dingdaoos/lucid-icons

import LucidIcons from '@dingdaoos/lucid-icons'
Vue.use(LucidIcons)
```

#### 按需引用
借助 babel-plugin-import，我们可以只引入需要的组件，以达到减小项目体积的目的。

首先，安装 babel-plugin-import。
1) 安装插件
```javascript
npm install babel-plugin-import -D
```
2) 配置插件
在 .babelrc 或 babel.config.js 中添加配置：

```javascript
{
    "plugins": [
        [
        "import",
        {
            "libraryName": "@dingdaoos/lucid-icons",
            "libraryDirectory": "lib"
        }
        ]
    ]
}
```
接下来，如果你只希望引入部分Icon，比如 IconLoading 和 IconCamera，那么需要在 main.js 中写入以下内容：


```javascript
import { IconLoading, IconCamera } from '@dingdaoos/lucid-icons'
Vue.use(IconLoading)
Vue.use(IconCamera)
```

#### UMD 方式使用组件

在浏览器中使用 script 和 link 标签直接引入文件（不推荐）

> 请确保已提前引入 Vue 2.x，推荐使用 2.6.x 版本

`UMD: https://lucent.dev.dingdaoos.com/lucid-icons/lucid-icons.umd.js`

`UMD min: https://lucent.dev.dingdaoos.com/lucid-icons/lucid-icons.umd.min.js`

`CSS: https://lucent.dev.dingdaoos.com/lucid-icons/lucid-icons.css`

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