專案使用antd 來做介面在進入內網開發的時候出現了，icon離線無法顯示的問題。網上找了方法並通過官網例子解決了該問題，但出現了預設樣式覆蓋的問題。因為專案原樣式改動多，後來找到了解決方法.

1.引入官方圖示庫。

  在官網下載解壓名為iconfont-2.10.x的壓縮包，解壓後刪除含有demo欄位的例子。將餘下的6個檔名含有iconfont欄位的檔案複製到node_modules\antd\dist下新建的iconfont資料夾下。

2，修改.less檔案

在專案的css入口檔案對面的.less檔案加入下面2句（我的是在app/static/css/common.less）.不同專案有不同

@import 
 
"~antd/dist/antd1.less";
@icon-url: '~antd/dist/iconfont/iconfont';

3.修改antd1.less

在node_modules/antd/dist下複製antd.less，重新命名antd1.less貼上到同目錄下修改如下

@import "../lib/style/index.less";
//@import "../lib/style/components.less";

--------------------------------------------------------------------------------------------------------------

1,專案直接eject命令，在出來的webpack.config.dev.js中將ModuleScopePlugin註釋掉：

//new ModuleScopePlugin(paths.appSrc, [paths.appPackageJson]),

該目的是解除使用該工具構建專案。官方限制的src資料夾不能引用外部檔案限制。

2，將上面方法第一步中的iconfont資料夾拷貝2份，一份到node_modules/antd/lib/style/core目錄，一份到專案的public目錄。（拷貝到lib/style/core目錄我也不知道為什麼，專案就是報錯這邊找不到就拷貝過去了）

3，在public目錄下新建一個.less 檔案寫入下面2句(注意是antd1.less)

@import "../node_modules/antd/dist/antd1.less";
@icon-url: './iconfont/iconfont';

4,在node_modules/antd/dist下複製antd.less，重新命名antd1.less貼上到同目錄下修改如下.

@import "../lib/style/index.less";
//@import "../lib/style/components.less";

5.在自己用了antd外掛的地方引入public下自己新建的.less檔案即可。