iconfont本地化

[kimoziiiii]

参考了此样例 : https://github.com/ant-design/antd-init/tree/master/examples/local-iconfont 新增了custom.less和修改了 index.less中的内容 custom.less

@icon-url: "/iconfont/iconfont";  // 把 iconfont 地址改到本地

index.less

@import "~antd/lib/style/themes/default.less";
@import "custom.less";
@import "~antd/lib/style/core/index.less";
@import "~antd/lib/style/components.less";  

同时在src目录下简立了iconfont目录并下载了了 iconfont.ttf iconfont.woff等文件放入该目录下， 测试结果控制台显示：

求大神解释。。。样例实在太少了，对于没写过前端的人来说简直就是完全是摸着石头过河。

[sorrycc]

@icon-url: "/iconfont/iconfont";

换成相对路径试试。

[kimoziiiii]

真早 :) 尝试修改为：

@icon-url: "./iconfont/iconfont";

启动报错：

ERROR in ./src/index.less
Module build failed: ModuleNotFoundError: Module not found: Error: Cannot resolve 'file' or 'directory' ../node_modules/.2.5.2@antd/lib/style/core/iconfont/iconfont.eot in D:\ITOps\frontend\src

我试着看了下这个变量icon-url覆盖了antd的默认值: @icon-url : "https://at.alicdn.com/t/font_r5u29ls31bgldi";

下一步不知道怎么搞.. 求指点..

[sorrycc]

还没试过 antd 的 theme 配置，帮不上忙了。

[kimoziiiii]

:(

[afc163]

https://github.com/visvadw/dvajs-user-dashboard/pull/2

[imaxing]

@kimoziiiii

let path = require('path'); //获取字体文件的相对项目的文件路径
let relativePath = path.relative(`${项目名称}/node_modules/antd/es/style/core`,`${项目名称}/src/assets/iconfonts/iconfont`).replace(/\\/g,'/');
module.exports = { 
   'icon-url': `"${relativePath}"`
}

[xijin]

https://my.oschina.net/u/1757225/blog/1795013 我通过这个方法解决了，非常简洁