场景：

vue-cli搭建的工程化项目，引入element框架后发现图标无效，变为方块

解决方案：

在index.html引入样式文件CDN链接即可

<!-- 引入样式 -->

<link rel="stylesheet" href="https://unpkg.com/element-ui/lib/theme-chalk/index.css">

引入成功后会发现之前的font-awesome无效，这时去源码查看会看到font-awesome图标前缀是fa fa-xxx形式，但element框架的图标源码格式为el-icon-xxx形式。

.

Vue工程化之引入element-ui框架后图标失效的更多相关文章

  1. vue按需引入Element UI的方法

    在我们的实际项目开发中,多数是采用按需引入的模式来进行开发的,那么具体应该如何操作呢,可能会有许多新人傻傻分不清楚,具体将在下文讲到. 首先我们先vue create demo创建一个项目出来此时我们 ...

  2. vue Cli 按需引入Element UI 和全局引用Element UI

    全局引用: 一.安装 Element UI npm i element-ui -S 二.在main.js 中引入 element UI import ElementUI from 'element-u ...

  3. Element UI 框架搭建

    Element UI 框架搭建 1.webpack 全局安装 npm install -g webpack 2.淘宝镜像cnpm安装 npm install -g cnpm --registry=ht ...

  4. vue按需引入element或mint

    vue按需引入element或mint需要添加 babel-preset-es2015 和babel-plugin-component

  5. vue项目中使用了vw适配方案，引入第三方ui框架mint-ui时，适配问题解决

    问题分析: 一般第三方ui框架用的都是不同的适配方式,如果我们使用了vw适配,那么在使用mint-ui框架时,就会发现px单位会被转换成vw,从而导致样式变小的问题,如图 解决方案 网上看到了很多种解 ...

  6. vue-cli脚手架引入element UI的正确打开方式

    element UI官网教程:http://element-cn.eleme.io/#/zh-CN/component/quickstart 1.完整引入,直接了当,但是组件文件不是按需加载,造成多余 ...

  7. Laravel 6.X + Vue.js 2.X + Element UI +vue-router 配置

    Laravel 版本:6.X Vue 版本:2.X Laravel配置: Laravel使用的是Laragon安装 选择Laravel:接下来弹出框,输入项目名,laravel会自动创建一个数据库,数 ...

  8. vue统计组件库和ui框架

    UI组件 element ★13489 - 饿了么出品的Vue2的web UI工具套件 Vux ★8133 - 基于Vue和WeUI的组件库 iview ★6634 - 基于 Vuejs 的开源 UI ...

  9. vue中的swiper element ui

    欢迎加入前端交流群交流知识&&获取视频资料:749539640 很多同学问,怎么把swiper引入到vue的脚手架里去,之前的一篇博客有提到怎么引入,但是后来感觉不怎么好,还是用一些v ...

随机推荐

  1. Golang（四）正则表达式使用

    0. 前言 最近用到了 regexp 包,下面整理下正则表达式相关用法 参考 基础知识 - Golang 中的正则表达式 和 Golang regexp包中的函数和方法 做了汇总 1. 正则表达式 1 ...

  2. Linux 就该这么学 CH05 用户的身份和文件权限

    1 用户权限与能力 超级用户root拥有最高的系统所有权,能够管理系统的各项功能,如添加.删除用户:启动或关闭服务进程:开启或禁用硬件设备等. 用户身份分类: 系统管理员root :UID = 0; ...

  3. python 统计字符串中指定字符出现次数的方法

    python 统计字符串中指定字符出现次数的方法: strs = "They look good and stick good!" count_set = ['look','goo ...

  4. 基于ELK 7.50搭建elastalert 监控报警和权限控制

    ELK+监控报警全步骤 需求: 公司要求对出在windows服务器上的日志进行日志分析并根据关键字进行报警,并配置kibana权限控制.下面为详细步骤 环境: centos 7.6 elk版本7.50 ...

  5. AVLMap平衡二叉树

    public class AVLMap<K, V> implements Iterable<AVLEntry<K, V>> { private int size; ...

  6. 用Powershell强制同步Windows主机与Internet time server的时间

    第一步,判断Windows Time服务是否正在运行,如果没有,则开启它. 第二步,强制同步,不知为何,往往第一次会失败,那么就多运行几次好了. Get-Service w32time | Where ...

  7. Win 10 设置右键以管理员方式打开 CMD 窗口

    Add_Open_Command_Window_Here_as_Administrator.reg Windows Registry Editor Version 5.00 [-HKEY_CLASSE ...

  8. [转帖]美团在Redis上踩过的一些坑-4.redis内存使用优化

    美团在Redis上踩过的一些坑-4.redis内存使用优化 博客分类: 运维 redis redisstringhash优化segment-hash  转载请注明出处哈:http://carlosfu ...

  9. yum 删除了，如何重新导入

    说明:准备研究docker时遇到的问题,提示如下: [root@localhost116 yum-package]# rpm -ivh yum--.el6.centos.noarch.rpm warn ...

  10. Git系列 —— 记一次Mac上git push时总是403的错误

    问题: 今天从github上clone下一个项目,然后修改后git push时总是出现: remote:Permission to lixyou/rw-split-plugin.git defined ...