getIconfontNameByExtension

根据文件后缀（或文件名）获取对应的 iconfont 图标名，内部通过「后缀 → MIME → iconfont」两级映射完成解析。

文件信息

文件名或后缀

默认图标（兜底）

快速选择示例

解析结果

iconfont 名称

PDF

完整 class（默认前缀 icon-）

.icon-PDF

在 Vue UI 中可以配合 <CwIcon :name="iconfontName" prefix="icon" /> 使用。

函数签名

interface GetIconfontNameByExtensionOptions {
  /** 找不到匹配时的默认图标名（不带前缀），默认 'others' */
  defaultIcon?: string
}

/** 根据 MIME 获取 iconfont 图标名 */
function getIconfontNameByMime(
  mime: string | undefined | null,
  options?: GetIconfontNameByExtensionOptions
): string

/** 根据文件名或后缀获取 iconfont 图标名 */
function getIconfontNameByExtension(
  filenameOrExtension: string,
  options?: GetIconfontNameByExtensionOptions
): string

参数

参数名	类型	必填	说明
filenameOrExtension	string	是	文件名（如 report.pdf）或后缀（如 pdf / .pdf）
options	GetIconfontNameByExtensionOptions	否	配置项，支持自定义默认图标

返回值

类型	说明
string	iconfont 图标名（不带前缀，如 'PDF'、'Excel'、'tupian'）

工作原理

1. 解析 filenameOrExtension，优先按完整文件名提取扩展名，失败时再将输入视为纯后缀并去掉前导点。
2. 使用内部的 extensionToMimeMap 将扩展名映射为标准 MIME 类型（如 pdf → application/pdf）。
3. 使用 mimeToIconfontMap 将 MIME 映射为具体的 iconfont 图标名（如 application/pdf → 'PDF'）。
4. 对未显式配置的 MIME，按大类进行兜底映射（如 image/* → 'tupian'、audio/* → 'Mp3'）。
5. 如果仍然无法匹配，则返回 options.defaultIcon，默认值为 'others'。

常见映射

文档类

后缀	MIME	图标名
pdf	application/pdf	PDF
doc / docx	Word 文档	Doc
ppt / pptx	PowerPoint 文档	PPT
xls / xlsx / csv	Excel 文档或表格	Excel
txt / log / md / json	文本/配置文件	TXT

压缩包

后缀	图标名
zip / rar / 7z / tar / gz	Zip

图片

后缀	图标名
png / jpg / jpeg / bmp / webp	tupian
gif	Gif
svg	Svg

音视频

后缀	图标名
mp3 / flac / aac / ogg	Mp3
wav	Wav
mp4 / mov / avi / mkv / webm	Mov

设计 / 工程文件

后缀	图标名
psd	Ps
ai	Ai
xd	Xd
aep	Ae
prproj	Pr

电子书与思维导图

后缀	图标名
epub / mobi / azw3	tushu
xmind	siweidaotu

兜底

• 未知类型或未配置类型 → others（可通过 defaultIcon 修改）

使用示例

import { getIconfontNameByExtension } from 'zcw-shared/functions/file/getIconfontNameByExtension'

// 文档
getIconfontNameByExtension('report.pdf')       // 'PDF'
getIconfontNameByExtension('data.xlsx')        // 'Excel'

// 图片
getIconfontNameByExtension('photo.png')        // 'tupian'
getIconfontNameByExtension('logo.svg')         // 'Svg'

// 音视频
getIconfontNameByExtension('music.mp3')        // 'Mp3'
getIconfontNameByExtension('movie.mp4')        // 'Mov'

// 设计文件
getIconfontNameByExtension('design.psd')       // 'Ps'
getIconfontNameByExtension('banner.ai')        // 'Ai'

// 直接传入后缀
getIconfontNameByExtension('pdf')              // 'PDF'
getIconfontNameByExtension('.zip')             // 'Zip'

// 自定义兜底图标
getIconfontNameByExtension('unknown.xyz', {
  defaultIcon: 'others'
}) // 'others'