1.0.2 • Published 4 years ago

@dingdaoos/lucid-icons

Licence

BSD

Version

1.0.2

Deps

Size

1.4 MB

Vulns

Weekly

Summary Dependency Versions

A DingOS Web UI Components Library for Vue 2.x

How to use

全局引用

npm install -S @dingdaoos/lucid-icons

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

按需引用

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

首先，安装 babel-plugin-import。

安装插件

npm install babel-plugin-import -D

配置插件在 .babelrc 或 babel.config.js 中添加配置：

{
    "plugins": [
        [
        "import",
        {
            "libraryName": "@dingdaoos/lucid-icons",
            "libraryDirectory": "lib"
        }
        ]
    ]
}

接下来，如果你只希望引入部分Icon，比如 IconLoading 和 IconCamera，那么需要在 main.js 中写入以下内容：

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

Keywords

components icon