参考:vue-基于elementui换肤[自定义主题]

实践:

需求1.后期维护主题色不更换:

   直接在线主题生成工具下载,在APP.VUE引入;(注意Element UI 版本1.3?2.0)

  

需求2.后期维护主题色频繁更换:

   需要两个工具:
           步骤1.element-variables.scss 可以设置自定义主题(按钮颜色需求、根字体大小等),输入指令:et 后,

会下载设置的自定义主题:theme;( 也可以,直接在线下载,放入theme文件夹)

   

  步骤2. gulpfile.js 把上述的theme文件主题,输入指令:gulp css-wrap 压缩打包成规定的文件,方便后期动态替换主题色;

        

Element-UI动态更换主题的更多相关文章

  1. 使用 css/less 动态更换主题色(换肤功能)

    前言 说起换肤功能,前端肯定不陌生,其实就是颜色值的更换,实现方式有很多,也各有优缺点 一.看需求是什么 一般来说换肤的需求分为两种: 1. 一种是几种可供选择的颜色/主题样式,进行选择切换,这种可供 ...

  2. element ui 动态菜单解决方案集锦

    1.<分享一个VUE Element-UI 的多级菜单动态渲染的组件> 2.<饿了么组件库,element-ui开发精美的后台管理系统系列之(一)开发伸缩菜单> 3.<V ...

  3. vue 使用 element ui动态添加表单

    html部分 <div class="hello"> <el-form :model="dynamicValidateForm" ref=&q ...

  4. element ui主题色跟换

    node_modules\ element ui\ lib\ theme-dafault  下载的主题色替换掉改文件... ================== 但是会出现  搜索框iocon 样式换 ...

  5. vue + element ui 实现实现动态渲染表格

    前言:之前需要做一个页面,能够通过表名动态渲染出不同的表格,这里记录一下.转载请注明出处:https://www.cnblogs.com/yuxiaole/p/9786326.html 网站地址:我的 ...

  6. vue+element ui 的tab 动态增减,切换时提示用户是否切换

    前言:工作中用到 vue+element ui 的前端框架,动态添加 Tab,删除 Tab,切换 Tab 时提示用户是否切换等,发现 element ui  有一个 bug,这里记录一下如何实现.转载 ...

  7. vue2.0+Element UI 实现动态表单(点击按钮增删一排输入框)

    对于动态增减表单项,Element UI 官方文档表单那一节已经介绍得很清楚了,我之前没有看见,绕了很多弯路,这里针对点击按钮增删一排输入框的问题做一个总结. 效果图如下 存在一排必填的姓名与手机号, ...

  8. 【转】【iOS】动态更换App图标

    原文网址:http://www.cocoachina.com/ios/20170619/19557.html 前言 动态更换App图标这件事,在用户里总是存在需求的:有些用户喜欢“美化”自己的手机.至 ...

  9. element ui 1.4 升级到 2.0.11

    公司的框架 选取的是 花裤衩大神开源的 基于 element ui + Vue 的后台管理项目, 项目源码就不公开了,记录 分享下 步骤 1. 卸载 element ui 1.4的依赖包 2. 卸载完 ...

随机推荐

  1. ansible基础-task控制

    1. 前言 很多情况下,一个play是否执行会依赖于某个(些)变量的值,这个变量可以来自自定义变量.facts,甚至是另一个task的执行结果. ansible通过变量判定task是否执行,我们称之为 ...

  2. 【神经网络篇】--RNN递归神经网络初始与详解

    一.前述 传统的神经网络每个输入节点之间没有联系, RNN (对中间信息保留): 由图可知,比如第二个节点的输入不仅依赖于本身的输入U1,而且依赖上一个节点的输入W0,U0,同样第三个节点依赖于前两个 ...

  3. UmengAppDemo【友盟统计SDK集成以及多渠道打包配置,基于V7.5.3版本】

    版权声明:本文为HaiyuKing原创文章,转载请注明出处! 前言 这里只是记录下集成友盟统计SDK以及简单配置多渠道打包的步骤.所以1.该Demo不能运行:2.配置多渠道打包只是一种简单的写法,具体 ...

  4. Ubuntu下搜狗输入法的安装教程

            前面写过一篇centos7下搜狗输入法的安装教程,现在把搜狗输入法在Ubuntu下的安装方法也记录一下,相比之下Ubuntu下安装搜狗输入法要简便得多 安装fcitx以支持搜狗输入法 ...

  5. Ocelot-基于.NET Core的开源网关实现

    写在前面 API网关是系统内部服务暴露在外部的一个访问入口,类似于代理服务器,就像一个公司的门卫承担着寻址.限制进入.安全检查.位置引导等工作,我们可以形象的用下图来表示: 外部设备需要访问内部系统服 ...

  6. windows系统dokuwiki安装部署设置 xampp环境配置

    简单记录一次安装dokuwiki的过程 dokuwiki下载 dokuwiki下载地址 https://download.dokuwiki.org/ 下载前有一些可选项目,版本.语言.插件,可以按照需 ...

  7. DSAPI 图形图像篇(上)

    彩色文字对象 基于一些特殊需求,本人开发了彩色文字对象,该功能通过类似html代码的方式指示文本,并输出图像. 我们还是先来看一张图像. 这不是文本,是通过指定文本代码输出的图像.我们来看一下实现代码 ...

  8. C#工具:MySQL忘记密码解决方法

    1.进入管理员控制台停止mysql服务:net stop mysql; 2.进入mysql的安装路径,如我的安装路径为C:\Program Files\MySQL\MySQL Server 5.5,打 ...

  9. Abp.Castle.Log4Net : Method 'get_IsTraceEnabled' does not have an implementation

    异常内容 System.TypeLoadException HResult=0x80131522 Message=Method 'get_IsTraceEnabled' in type 'Abp.Ca ...

  10. 【网摘】C#中TransactionScope的使用方法和原理

    时间 2013-08-12 19:59:34  51CTO推荐博文 原文  http://cnn237111.blog.51cto.com/2359144/1271600 在.net 1.1的时代,还 ...