@fish-render/icons

Fish Render 图标库，支持 Vue 3 和按需导入。

安装

npm install @fish-render/icons

使用方法

完整导入

import { Left, Right, Add, Delete } from '@fish-render/icons'

按需导入（推荐）

// 从主包按需导入
import { Left, Right, Add, Delete } from '@fish-render/icons'

// 或者直接从具体图标文件导入（更小的打包体积）
import { Left } from '@fish-render/icons/icons/Left'
import { Right } from '@fish-render/icons/icons/Right'
import { Add } from '@fish-render/icons/icons/Add'
import { Delete } from '@fish-render/icons/icons/Delete'

在 Vue 组件中使用

<template>
  <div>
    <Left />
    <Right />
    <Add />
    <Delete />
  </div>
</template>

<script setup>
import { Left, Right, Add, Delete } from '@fish-render/icons'
</script>

可用的图标

• Left - 左箭头
• Right - 右箭头
• Add - 添加
• Delete - 删除
• Selected - 选中
• Fillin - 填充
• InformationAdd - 信息添加
• More - 更多
• More1 - 更多 1
• Refresh - 刷新
• Search - 搜索
• Trash - 垃圾桶
• Under - 下箭头
• Up - 上箭头

按需导入的优势

1. 更小的打包体积: 只导入需要的图标，减少最终打包大小
2. 更好的性能: 减少不必要的代码加载
3. 更灵活的导入方式: 支持从主包或具体文件导入

构建配置

本包支持以下构建格式：

• ES Module (.mjs)
• UMD (.umd.js)
• TypeScript 声明文件 (.d.ts)

开发

# 安装依赖
npm install

# 开发模式
npm run dev

# 构建
npm run build

# 生成图标
npm run generate