如何将Ant Design Icon本地化

本文主要解决:

    在内网/离网环境使用React+Ant Design进行项目开发时,Icon显示异常问题;

离线使用IconFont步骤:

1、在 ( iconfont.cn ) 上把Ant图标下载到本地。

     (下载方式参考:https://blog.csdn.net/guoyangyang123456/article/details/70314210)

2、 把下载的Iconfont放到以下地方:

    (1)放到/node_modules/antd下

如何将Ant Design Icon本地化_第1张图片

    (2)放在public下

如何将Ant Design Icon本地化_第2张图片

    3、修改对应的引用目录:

        (1)修改node_modules/antd/dist/antd.css下对应路径(把https://at.alicdn.com/t/font_148784_v4ggb6wrjmkotj4i.woff换成本地路径

如何将Ant Design Icon本地化_第3张图片
        (2)修改node_modules/antd/lib/style/index.css下对应路径(把 https://at.alicdn.com/t/font_148784_v4ggb6wrjmkotj4i.woff换成本地路径
如何将Ant Design Icon本地化_第4张图片

      重新运行一下项目,图标本地化工作就完成了。


你可能感兴趣的:(Ant,design,Ant,design,Iconfont,本地化)