iconfont.cn引用

src/compenents/header/index.tsx

@@ -6,7 +6,11 @@ import { useDispatch } from "react-redux";
 import { useNavigate } from "react-router-dom";
 import { LoginOutActionCreator } from "../../store/user/userActions";
 import avatar from "../../assets/images/commen/avatar.png";
-import { PoweroffOutlined, UnlockOutlined } from "@ant-design/icons";
+import { createFromIconfontCN } from "@ant-design/icons";
+
+const IconFont = createFromIconfontCN({
+  scriptUrl: "//at.alicdn.com/t/c/font_3943555_yvbihmb40xn.js",
+});
 
 export const Header: React.FC = () => {
   const dispatch = useDispatch();
@@ -25,12 +29,12 @@ export const Header: React.FC = () => {
     {
       label: "修改密码",
       key: "change_password",
-      icon: <UnlockOutlined style={{ color: "#ff4d4f" }} />,
+      icon: <IconFont type="icon-icon-password" />,
     },
     {
       label: "退出登录",
       key: "login_out",
-      icon: <PoweroffOutlined style={{ color: "#ff4d4f" }} />,
+      icon: <IconFont type="icon-a-icon-logout" />,
     },
   ];
   return (

src/compenents/left-menu/index.tsx

@@ -1,15 +1,15 @@
 import React, { useEffect } from "react";
-import {
-  MailOutlined,
-  SettingOutlined,
-  AppstoreOutlined,
-} from "@ant-design/icons";
+import { createFromIconfontCN } from '@ant-design/icons';
 import { Menu } from "antd";
 //导出路由跳转hooks函数
 import { useNavigate, Link, useLocation } from "react-router-dom";
 import styles from "./index.module.less";
 import logo from "../../assets/logo.png";
 
+const IconFont = createFromIconfontCN({
+  scriptUrl: '//at.alicdn.com/t/c/font_3943555_yvbihmb40xn.js',
+});
+
 function getItem(label: any, key: any, icon: any, children: any, type: any) {
   return {
     key,
@@ -20,12 +20,12 @@ function getItem(label: any, key: any, icon: any, children: any, type: any) {
   };
 }
 const items = [
-  getItem("首页概览", "/", <SettingOutlined />, null, null),
-  getItem("分类管理", "/resource-category", <MailOutlined />, null, null),
+  getItem("首页概览", "/", <IconFont type="icon-icon-home" />, null, null),
+  getItem("分类管理", "/resource-category", <IconFont type="icon-icon-category" />, null, null),
   getItem(
     "资源管理",
     "3",
-    <MailOutlined />,
+    <IconFont type="icon-icon-file" />,
     [
       getItem("视频", "/videos", null, null, null),
       getItem("图片", "/images", null, null, null),
@@ -35,14 +35,14 @@ const items = [
   getItem(
     "课程中心",
     "4",
-    <AppstoreOutlined />,
+    <IconFont type="icon-icon-study" />,
     [getItem("线上课", "/course", null, null, null)],
     null
   ),
   getItem(
     "学员管理",
     "5",
-    <AppstoreOutlined />,
+    <IconFont type="icon-icon-user" />,
     [
       getItem("学员", "/member", null, null, null),
       getItem("部门", "/department", null, null, null),
@@ -52,7 +52,7 @@ const items = [
   getItem(
     "系统设置",
     "6",
-    <SettingOutlined />,
+    <IconFont type="icon-icon-setting" />,
     [
       getItem("管理人员", "/system/administrator", null, null, null),
       getItem("系统配置", "/system/index", null, null, null),