在webpack項目開發中,難免會需要一些圖標,如果用到bootstrap4的話,就會碰到一些問,因為bootstrap 4.x版本把icon分離出來作為一個單獨的項目open-iconic,所以cnpm i bootstrap -S是還不夠的。還需要在安裝open-iconic項目。
1. 下載安裝:cnpm i bootstrap -S
如果是4以上的版本,還需要安裝 cnpm i https://github.com/iconic/open-iconic.git -D
2. 在main.js引入(這個主文件看個人,有的是index.js)
1 import 'bootstrap/dist/css/bootstrap.css' 2 import 'open-iconic/font/css/open-iconic-bootstrap.css'
3.在webpack.config.js中配置
1 {test:/\.(ttf|eot|svg|woff|woff2|otf)$/, use: 'url-loader'}
4.在index.html中
<span class="oi oi-account-login"></span> <span class="oi oi-account-logout"></span>
效果: