ant design使用本地IconFont文件

先参考这个官网的示例 :
官网示例:通过设置 createFromIconfontCN 方法参数对象中的 scriptUrl 字段, 可以使用 iconfont.cn 项目中的图标。
在iconfont.cn网站使用symbol方式生成在线链接。

 

但官网的说明有个问题,就是全部使用的是网络引用,有时候我们需要的环境可能并不是一个有外网的环境。所以我们需要将网络引用改为本地引用。

改为本地引用的方法也很简单。
将 //at.alicdn.com/t/font_xxx.js 这个文件下载下来,放在public 目录下面,例如存为font_xxx.js 然后

import { Icon } from 'antd';

const IconFont = Icon.createFromIconfontCN({
  // scriptUrl: '//at.alicdn.com/t/font_xxx.js'
   scriptUrl: './font_xxx.js'//使用相对路径可以避免路径错误
});

export default IconFont;

 

posted @ 2024-09-12 15:10  mingruqi  阅读(6)  评论(0编辑  收藏  举报