主题安装分为全局安装和局部安装(局部安装指的是项目内进行安装)

局部安装:

使用局部安装方便他人使用,他人直接安装主题需要的依赖就可以进行使用

局部安装的步骤

1.npm i element-theme

2.npm i element-theme-chalk -D

3. et -i

当命令行出现了 generator variables file的时候,文件的根目录下就会自动新增一个scss文件,这个scss文件里面就是包含的各种主题色,可以修改你想要变成的颜色,

eg:$--color-primary: 改成红色

之后需要进行命令编译下你修改的主题

输入 et

当出现上方的bluid element theme 和build theme font 即为修改的主题生效了

vue-cli中的element-ui的主题更改的更多相关文章

  1. 在Vue项目中使用Element UI:按需引入和完整引入

    下面操作在main.js文件中进行 完整引入: import Element from 'element-ui'; //样式文件,需单独引入 import 'element-ui/lib/theme- ...

  2. vue项目中使用element ui上传图片到七牛

    1.获取token值 后台有接口调用直接返回token值 //请求后台拿七牛云token async getQiniuToken() { //token let uploadtoken = await ...

  3. 如何在 Vite 中使用 Element UI + Vue 3

    在上篇文章<2021新年 Vue3.0 + Element UI 尝鲜小记>里,我们尝试使用了 Vue CLI 创建 Vue 3 + Element UI 的项目,而 Vue CLI 实际 ...

  4. 在vue中关于element UI 中表格实现下载功能,表头添加按钮,和点击事件失效的解决办法。

    因为在element 中表格是使用el-table的形式通过数据来支撑结构,所以,表格的样式没有自己写的灵活,所以有了没法添加按钮的烦恼.下面是解决的方法. 准备工作: 一.下载npm安装包两个 1. ...

  5. Vue Cli 中使用 Karma / Chrome 执行样式相关单元测试

    在 GearCase 开源项目 中,我使用了 Vue Cli 的默认测试框架.因此和样式相关的东西,都无法进行测试.因为它并不类似于无头浏览器,而是存在于虚拟内存之中. 现状 在如下 button.s ...

  6. vue问题三:element ui的upload组件上传图片成功和移除事件

    element ui的upload组件上传图片成功和移除事件: 登录后获取到后台传的token存到中: sessionStorage.setItem("token",data.ob ...

  7. vue cli 中关于vue.config.js中chainWebpack的配置

    Vue CLI  的官方文档上写:调整webpack配置最简单的方式就是在vue.config.js中的configureWebpack选项提供一个对象. Vue CLI 内部的 webpack 配置 ...

  8. vue cli中的env详解

    前言 相信使用过 vueCli 开发项目的小伙伴有点郁闷,正常开发时会有三个接口环境(开发,测试,正式),但是 vueCli 只提供了两种 development,production(不包含 tes ...

  9. element ui 自定义主题失败(primordials is not defined)

    卸载: 1.卸载cnpm npm uninstall cnpm -g 2.卸载vue-cli npm uninstall @vue/cli -g 3.卸载nodejs和删除文件 C:\Program ...

  10. php项目中使用element.ui和vue

    1.plugins中添加axios,element-ui 2.全局文件下引入 <script src="/static/plugins/vue@2.5.13/vue.js"& ...

随机推荐

  1. LinQ实现DataTable不定行转列 行列转换,有图

    <%@ Page Language="C#" AutoEventWireup="true" CodeFile="LinqDemo2.aspx.c ...

  2. 图示详解BERT模型的输入与输出

    一.BERT整体结构 BERT主要用了Transformer的Encoder,而没有用其Decoder,我想是因为BERT是一个预训练模型,只要学到其中语义关系即可,不需要去解码完成具体的任务.整体架 ...

  3. mybatis源码/mybatis执行流程源码解析

    https://www.cnblogs.com/cxiaocai/tag/%E9%9D%A2%E8%AF%95%E9%A2%98/public SqlSession session; public S ...

  4. 找出所有文件最小可resize尺寸

    --找出所有文件最小可resize尺寸 SELECT a.file_id, CEIL( ( NVL( hwm,1 ) * blksize ) / 1024 / 1024 ) smallest_M, C ...

  5. java基本类型的长度

    bit:位,一个二进制数据(0或者1),是1bit byte:字节,存储空间的基本单位,1byte=8bit 一个英文占一个字节,1字母=1byte=8bit 一个中文占两个字节,1汉字=2byte= ...

  6. OpenLDAP 安装教程

    OpenLDAP 安装教程 本文原始地址:https://sitoi.cn/posts/48217.html 在centos7上安装OpenLDAP 环境准备 两台虚拟机 node01 IP:192. ...

  7. 十、lambda表达式、内置函数之filter、map、reduce

    lambda表达式   学习条件运算时,对于简单的 if else 语句,可以使用三元运算来表示,即: # 普通条件语句 == : name = 'wupeiqi' else: name = 'ale ...

  8. Android Studio + uiautomator 配置运行

    1.在build.gradle中添加依赖: androidTestImplementation 'com.android.support.test.uiautomator:uiautomator-v1 ...

  9. fiddler深入学习

    参考:https://www.cnblogs.com/zhizhiyin/p/6807649.html http://blog.chinaunix.net/uid-27105712-id-373882 ...

  10. ES6学习笔记 -- 尾调用优化

    什么是尾调用? 尾调用(Tail Call)是函数式编程的一个重要概念,就是指某个函数的最后一步是调用另一个函数. function f(x) { return g(x) } 如上,函数 f 的最后一 ...