webpack在調(diào)試階段時字體，圖標顯示正常初狰，在npm run build 發(fā)布打包版本在服務端訪問時發(fā)現(xiàn)里面icon不顯示筝闹，調(diào)試發(fā)現(xiàn)訪問路徑不對
1.在本地訪問顯示效果
image.png
發(fā)現(xiàn)訪問路徑多了兩層目錄訪問路徑不對，應該找到文字圖標對應的路徑修改指定文件目錄下
2.打包后生成的dist文件目錄
3.解決方法
找到css文件夾里面的樣式文件，里面為壓縮文件汞舱，在編輯器里面格式化一下代碼
image.png
@font-face {
font-family: Ionicons;
src: url(static/css/ionicons.2c2ae06.eot);
src: url(static/css/ionicons.2c2ae06.eot#iefix) format("embedded-opentype"), url(static/css/ionicons.24712f6.ttf) format("truetype"), url(static/css/ionicons.05acfdb.woff) format("woff"), url(static/css/ionicons.621bd38.svg#Ionicons) format("svg");
font-weight: 400;
font-style: normal
}
找到@font-face樣式赔蒲，發(fā)現(xiàn)里面樣式的URL對應的路徑不對欢际，以為一開始訪問css文件夾患久，在里面訪問fonts字體文件夾應退一層目錄墙杯，修改后代碼為
@font-face {
font-family: Ionicons;
src: url(../fonts/ionicons.2c2ae06.eot);
src: url(../fonts/ionicons.2c2ae06.eot#iefix) format("embedded-opentype"), url(../fonts/ionicons.24712f6.ttf) format("truetype"), url(../fonts/ionicons.05acfdb.woff) format("woff"), url(../fonts/ionicons.621bd38.svg#Ionicons) format("svg");
font-weight: 400;
font-style: normal
}
4.修改路徑后訪問效果
微信截圖_20170608102219.png
