WebPack引用Bootstrap 无法使用图标的结局方案

番茄西红柿发布于2019-04-23 11:54 / 3522人阅读

摘要：因为的里删除了图标分开了我们在引入个呵呵。下载由于版本文件分离出去所以还需要下载下载可能有点慢，要花个几分钟，可用下载在中引入在中配置在中引用

npm i https://github.com/iconic/open-iconic.git -D 因为boostrap的css里删除了图标分开了我们在引入个呵呵。

下载：npm i bootstrap@4.1.3 -D
由于4.x版本icon文件分离出去所以还需要下载open-iconic：

npm i https://github.com/iconic/open-iconic.git -D(下载可能有点慢，要花个几分钟，可用cnpm下载)

在index.js中引入

import bootstrap/dist/css/bootstrap.css
import open-iconic/font/css/open-iconic-bootstrap.css

在webpack.config.js中配置
在html中引用

class="oi oi-account-login">
class="oi oi-account-logout">

GPU云服务器云服务器 webpack引用jquery bootstrap图标利用 bootstrap_icon图标图标html代码引用

文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。

转载请注明本文地址：https://www.ucloud.cn/yun/1338.html

webpack多页应用架构系列（十）：如何打造一个自定义的bootstrap

摘要：我个人惯用的是，因此本文以为例来介绍如何打造一个自定义的。引入全局的方法请看我之前的这篇文章多页应用架构系列四老式插件还不能丢，怎么兼容，我的脚手架项目也是使用的这套方案。本文首发于Array_Huang的技术博客——实用至上，非经作者同意，请勿转载。原文地址：https://segmentfault.com/a/1190000007043716如果您对本系列文章感兴趣，欢迎关注订阅...

jindong 2019-08-20 11:24 评论0 收藏0
前端面试之路一(HTML+CSS面试整理)

摘要：或表示红色，表示绿色，表示蓝色，也可取其他数值来指定颜色。针对多字节文字，中文句子也是单词允许在单词内换行。一、HTML基础 html常见元素和理解 html常见元素分类 head区元素：（不会在页面上留下直接内容） meta title style link script base body区： div/selection/article/aside/header/f...

hqman 2019-08-02 12:09 评论0 收藏0
前端面试之路一(HTML+CSS面试整理)

摘要：或表示红色，表示绿色，表示蓝色，也可取其他数值来指定颜色。针对多字节文字，中文句子也是单词允许在单词内换行。一、HTML基础 html常见元素和理解 html常见元素分类 head区元素：（不会在页面上留下直接内容） meta title style link script base body区： div/selection/article/aside/header/f...

YacaToy 2019-08-29 17:26 评论0 收藏0
前端资源收集整理

摘要：工作原因，最近一年断断续续写了一点前端代码，收集整理了一些资料，和大家共享。工作原因，最近一年断断续续写了一点前端代码，收集整理了一些资料，和大家共享。 Github版本：Front-End Resource Collection 前端相关资源汇总学习指导精华文章 Web前端的路该怎么走？：文章超长，但是干货超级多，值得反复精读！听说2017你想写前端？：适合于已经度过了小白阶...

awesome23 2019-08-20 18:23 评论0 收藏0
前端资源收集整理

摘要：工作原因，最近一年断断续续写了一点前端代码，收集整理了一些资料，和大家共享。工作原因，最近一年断断续续写了一点前端代码，收集整理了一些资料，和大家共享。 Github版本：Front-End Resource Collection 前端相关资源汇总学习指导精华文章 Web前端的路该怎么走？：文章超长，但是干货超级多，值得反复精读！听说2017你想写前端？：适合于已经度过了小白阶...

antyiwei 2019-08-29 13:03 评论0 收藏0