create-iking-admin/template-micro/iking-main-admin/src/mainApp/utils/render/renderIcon.ts

金合技术中台脚手架

/*
 * @Author: wfl
 * @LastEditors: wfl
 * @description:
 * @updateInfo:
 * @Date: 2022-08-25 13:59:56
 * @LastEditTime: 2022-10-25 15:43:31
 */
export interface IIcon {
  label: String;
  value: String;
  ic: String;
  icon: String;
  font_family: String;
}

export interface IIconf {
  css_prefix_text: String;
  description: String;
  font_family: String;
  glyphs: Array<{
    font_class: String;
    name: String;
    unicode: String;
  }>;
}

const icons: IIcon[] = [];
export const readIcon = (cache = true) => {
  // 若不需要实时更新，从缓存中获取即可
  if (cache && icons?.length) {
    return icons;
  }

  // 业务阿里iconfont文件放置在目录src/global/assets/icons下
  // 读取图标库 json文件
  const iconMoudles: { [key: string]: IIconf } = import.meta.glob(
    '@/global/assets/icons/**/*.json',
    { eager: true },
  );

  Object.keys(iconMoudles).forEach((icon) => {
    const presux = iconMoudles[icon].css_prefix_text;
    const fm = iconMoudles[icon].font_family;
    iconMoudles[icon].glyphs.forEach((gy) => {
      icons.push({
        label: `${presux}${gy.font_class}`,
        value: `${presux}${gy.font_class}`,
        ...gy,
        ic: `${presux}${gy.font_class}`,
        icon: `${fm} ${presux}${gy.font_class}`,
        font_family: fm,
      });
    });
  });
  return icons;
};