1200字范文,内容丰富有趣,写作的好帮手!
1200字范文 > element-ui全局自定义主题

element-ui全局自定义主题

时间:2019-06-25 19:53:51

相关推荐

element-ui全局自定义主题

在项目中改变 SCSS 变量

需要注意的是创建element-variables.scss文件在/src/下,注意路径问题

Element 的 theme-chalk 使用 SCSS 编写,如果你的项目也使用了 SCSS,那么可以直接在项目中改变 Element 的样式变量。新建一个样式文件,例如element-variables.scss,写入以下内容:

/* 改变主题色变量 */$--color-primary: teal;/* 改变 icon 字体路径变量,必需 */$--font-path: '~element-ui/lib/theme-chalk/fonts';@import "~element-ui/packages/theme-chalk/src/index";

之后,在项目的入口文件中,直接引入以上样式文件即可(无需引入 Element 编译好的 CSS 文件):

import Vue from 'vue'import Element from 'element-ui'import './element-variables.scss'Vue.use(Element)

需要注意的是,覆盖字体路径变量是必需的,将其赋值为 Element 中 icon 图标所在的相对路径即可。

这种办法较为方便

本内容不代表本网观点和政治立场,如有侵犯你的权益请联系我们处理。
网友评论
网友评论仅供其表达个人看法,并不表明网站立场。