elementUI本地引js,css 圖標不顯示問題

項目中有用到圖標 可是遇到了一些問題 在此僅作下記錄javascript

1.按官方文檔:(缺點是沒有網絡狀況下加載不出)css

<!-- 引入樣式 -->
<link rel="stylesheet" href="https://unpkg.com/element-ui/lib/theme-chalk/index.css">
<!-- 引入組件庫 -->
<script src="https://unpkg.com/element-ui/lib/index.js"></script>

2.把elementUI中的css、js下載到本地 ,頁面引本地的css、js 可是圖標不顯示(非網絡狀態下的)java

3.緣由  在本地的index.css中發現圖標路徑問題:node

@font-face {
    font-family: element-icons;
    src: url(fonts/element-icons.woff?t=1472440741) format('woff'),         
    url(fonts/element-icons.ttf?t=1472440741) format('truetype');
    font-weight: 400;
    font-style: normal
}  

4.因此須要本身下載一個字體 、圖標文件,新建fonts文件夾 ---> 放到css/fonts 如圖:
npm

 5.參考網上其餘資料的連接下載,但引到本地都很差用,在此建議你們在一個空文件用 npm下載node_modules,須要什麼從裏面複製出來element-ui

npm i element-ui -S

 

 路徑是 node_modules-->element-ui--->theme-chalk--->fonts網絡

 拿到fonts放到項目中css文件夾下 就能夠了字體

 參考文章:ui

 https://blog.csdn.net/m0_37893932/article/details/79460652url

相關文章
相關標籤/搜索