Dva: iconfont本地化

Created on 15 Dec 2016 · 7Comments · Source: dvajs/dva

参考了此样例 : 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等文件放入该目录下，
测试结果控制台显示：
qq 20161216001107

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

faq question

Source

kimoziiiii

Most helpful comment

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

afc163 on 16 Dec 2016

👍4

All 7 comments

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

换成相对路径试试。

sorrycc on 15 Dec 2016

真早 :)
尝试修改为：

@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";

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

kimoziiiii on 16 Dec 2016

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

sorrycc on 16 Dec 2016

kimoziiiii on 16 Dec 2016

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

afc163 on 16 Dec 2016

👍4

@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}"`
}