ant design pro 菜单栏使用图标
官网使用inconfont图标，推荐使用inconfont官网的线上地址
查看地址：https://pro.ant.design/zh-CN/docs/new-page/
我的项目是在config.ts 中的iconfontUrl
export default {navTheme: "dark", // 菜单的主题primaryColor: "daybreak", // Ant Design 的主色调layout: "sidemenu", // 菜单的布局contentWidth: "Fluid", // 内容的布局 Fixed 为定宽到1200pxfixedHeader: true, // 固定页头autoHideHeader: false, // 下滑时自动隐藏页头fixSiderbar: true, // 固定菜单menu: {locale: true},title: `${ProjectTtile}`,pwa: false,iconfontUrl: "///t/font_1716924_7j5cze0fcd8.js"} as DefaultSettings;
路由页面可以这样写，必须以 icon-开头才可以
问题
因为线上地址，员工维护不方便，公司要求引入本地使用。查了很多资料，菜单的图标都没有直接解决方法，组件使用还好一点。
解决方案
1.先把iconfontUrl 置空
2.登录antd官网看一直自己需要的图标
地址：https://ant-design.gitee.io/components/icon-cn/
复制代码
<BarChartOutlined />
3.改造使用
<BarChartOutlined />去除Outlined 变成BarChart 使用驼峰命名法barChart
这样就可以在ant design pro 路由中直接使用
{name: "dataintegration",icon: "barChart",path: `/${ProtalPath}/dataintegration`,component: "../layouts/BlankLayout.tsx",},
