# @coreui/icons-vue 中文文档

规范地址：https://npmcn.com/package/%40coreui/icons-vue/

版本：2\.2\.0
npm 元数据更新时间：2025-12-11T13:15:09.315Z
中文译文更新时间：2026-11-10T19:20:13.186Z
软件包许可：MIT

本文由上游 README 翻译，可能存在偏差，请结合原文核对 API、命令与配置。版权与许可归原作者所有。

原始 npm 页面：https://www.npmjs.com/package/%40coreui/icons-vue
原文对照：https://npmcn.com/package/%40coreui/icons-vue/?lang=original
项目主页：https://icons.coreui.io/
源码仓库：https://github.com/coreui/coreui-icons

## 关键信息（来自 npm 元数据）

- 包体积（解压后）：40.4 kB，14 个文件
- 模块格式：ESM + CJS
- TypeScript 类型：包内自带
- 运行依赖：0 个
- peer 依赖：vue ^3\.2\.20
- 首次发布：2019-12-03T13:48:28.512Z
- 最新版本发布：2024-08-29T22:10:54.493Z
- 近 30 天下载量：107636（2026-10-11 至 2026-11-09，npm 官方下载统计）
- 已发布版本数：22（近 12 个月 0 个）

## 中文简介

CoreUI 图标的官方 Vue 组件

## 安装

```sh
npm install @coreui/icons-vue
```

也可以使用：`pnpm add @coreui/icons-vue`、`yarn add @coreui/icons-vue`、`bun add @coreui/icons-vue`

## README

[![CoreUI Icons logo](https://coreui.io/images/brand/coreui-icons.svg)](https://coreui.io/)

CoreUI图标和CoreUI图标PRO的官方Vue.js组件.  
[**探索用于 Vue Docs 的 CoreUI 图标**](https://coreui.io/vue/docs/components/icon.html)  
  
[报告错误](https://github.com/coreui/coreui-icons/issues/new?template=bug_report.md) • 妇女 [请求特性](https://github.com/coreui/coreui-icons/issues/new?template=feature_request.md) • 妇女 [博客](https://blog.coreui.io/)

## 状态

[![NPM](https://img.shields.io/npm/v/@coreui/icons-vue/latest?style=flat-square&color=brightgreen)](https://coreui.io/icons) [![Downloads](https://img.shields.io/npm/dm/@coreui/icons-vue.svg?style=flat-square)](https://coreui.io/icons) [![License](https://img.shields.io/npm/l/@coreui/vue?style=flat-square)](https://coreui.io/icons)

## 安装

```bash
npm install @coreui/icons
npm install @coreui/icons-vue
```

或者说

```bash
yarn add @coreui/icons
yarn add @coreui/icons-vue
```

## 使用

### 单个图标

```jsx
import { CIcon } from '@coreui/icons-vue';
import { cifAu } from '@coreui/icons';

...
<CIcon :icon="cilAu" size="xxl"/>
...
```

### 所有图标

```jsx
import { CIcon } from '@coreui/icons-vue';
import * as icon from '@coreui/icons';

...
<CIcon :icon="icon.cilList" size="xxl"/>
...
```

## API 密码

| 属性 | 类型 | 说明 |
| --- | --- | --- |
| 自定义分类Name | `string` | `object` | `string[]` | 用于替换默认 CIcon 组件类 。 道具凌驾于"大小"道具之上. |
| 图标 | `string` | `string[]` | 放置在 React 对象或 SVG 内容中的图标名称 . |
| 高度 | `number` | 高度属性定义了图标的垂直长度. |
| 大小 | `sm` | `md` |`lg` | `xl` | `xxl` | `3xl` | `4xl` | `5xl` | `6xl` | `7xl` | `8xl` | `9xl` | 图标大小 . |
| 使用情况 | `string` | 如果定义的组件将使用 `use` 标签. |
| 标题 | `string` | 标题标签内容 . |
| 宽度 | `number` | 宽度属性定义了图标的横向长度. |

## 常见问题

### @coreui/icons-vue 是什么？

CoreUI 图标的官方 Vue 组件

### 如何安装 @coreui/icons-vue？

在项目目录运行 npm install @coreui/icons-vue，或使用 pnpm add / yarn add / bun add。它还需要宿主项目提供 peer 依赖：vue（^3\.2\.20）。npm 7 及以上与 pnpm 8 及以上默认会自动安装必需的 peer 依赖，Yarn 需要手动安装。

### @coreui/icons-vue 支持 TypeScript 吗？

支持。包内自带 TypeScript 类型声明（package\.json 声明了 types 入口），安装后即可获得类型提示，无需再安装 @types 包。

### @coreui/icons-vue 支持 ESM 还是 CommonJS？

同时提供 ES Module 与 CommonJS 入口，import 和 require\(\) 都可以使用，打包工具会自动选择合适的版本。

### @coreui/icons-vue 可以商用吗？

@coreui/icons-vue 使用 MIT 许可。宽松许可：允许商业使用、修改和再分发，通常只需在分发时保留原版权与许可声明。以上为概括，不构成法律意见，请以许可原文为准。

### @coreui/icons-vue 的下载量有多少？

根据 npm 官方下载统计，@coreui/icons-vue 在 2026/10/11 – 2026/11/09 这 30 天内被下载 107,636 次，日均约 3,588 次。下载量会把 CI 构建、镜像同步和作为其他包依赖的安装一并计入，适合横向比较热度，不能直接等同于使用人数。

### @coreui/icons-vue 还在维护吗？

最新版本 2\.2\.0 发布于 2024/08/30（2 年前）；至今共发布 22 个版本，其中过去 12 个月发布了 0 个；首次发布于 2019/12/03。发布频率只是参考信号：功能稳定的工具可能很少需要更新，建议结合源码仓库的 issue 和提交记录判断。