正文

element-ui修改自定义主题

IP云
IP云V管理员/6 阅读
10/29
提示：扫一扫查出行
【扫一扫了解最新限行尾号】
复制提示

官方文档：https://element.eleme.cn/#/zh-CN/component/custom-theme

简单更换主题色

  1. 打开：在线主题编辑器，仅修改主题色，点击右上角【切换主题色】，选择一个喜欢的颜色
  2. 点击【下载主题】，下载后的文件夹大概长这样

  1. 在项目根目录下新建theme文件夹，将刚刚下载文件夹里面所有文件复制进去

  1. 进入main.js修改对theme的引入

    从之前使用element-ui的默认theme

import 'element-ui/lib/theme-chalk/index.css'import ElementUI from 'element-ui'import Vue from 'vue'Vue.use(ElementUI)

修改为自定义的theme目录

import '../theme/index.css' //刚刚新建的目录复制进去的这些文件import ElementUI from 'element-ui'import Vue from 'vue'Vue.use(ElementUI)