方法是参照 官方指南,自己写了一个文件,替换主题,比如我想覆盖$button-border-radius这个变量,我自己文件中应该怎么写,下面写法没生效,全局也没找到--el-border-radius-base在哪里定义的 // element plus默认定义 // node_modules/element-plus/theme-chalk/src/common/var.scss $button-border-radius: map.merge(...
vue3 element-plus 通过 SCSS 变量修改主题 因为项目使用vue-cli的脚手架搭建的。 然后按照官方文档的写法通过 SCSS 变量 覆盖主题。 但是既没有报错,element-plus 的css的样式完全丢失了。 应该是没有编译成功生成新的css导致的。但是我的代码是完全按照官网复制粘贴的。还是出现了这种情况。 最后发现是因为。我在...
按照element-plus文档覆盖了scss变量,但是在main文件引入时报错tff文件无法找到,找了一圈之后发现需要在重写scss变量的文件同级创建一个fonts文件 应该有loader可以解决这个问题,不过时间短没细看,如果你有好的办法解决这个问题,可以在下方评论。 然后就遇到了最大的坑,他不生效。。 最后发现是文档的错(不管了,先甩锅...
global.scss中首先是准备一个默认主题,默认主题的作用有两个,首先一个是主题,第二个就是,其他主题不必要声明所有的变量,只需要覆盖部分变量即可,比如开发者只需要改primary color,只需要在自定义主题中写上color-primary、color-primary-deep、color-primary-light即可,其他变量如果在自定义主题中找不到,则使用默认主...
// element/index.scss /* 覆盖elementui的变量值 */ @forward 'element-plus/theme-chalk/src/common/var.scss' with ( $colors: ( 'primary': ( 'base': #3ca483 ) ) ); @import '../vars.scss'; @import '../mixin.scss'; // vite.config.ts css: { preprocessorOptions: { scss: { ...
element-variables.scss文件,这里就不贴出来了,具体可以看这里:element-variables.scss,这个文件里面定义了很多颜色变量 这种方法使用起来是简单的,你只需将其引入 修改里面的颜色变量即可生效。 这种方法是快捷的,修改几个颜色变量即可生效。(然后就可以部署啦~) ...
Element-Plus 提供了多种方式来自定义主题,包括使用 SCSS 变量覆盖默认样式、通过在线主题编辑器生成主题,或者直接在项目中修改主题样式文件。本文将重点介绍使用 SCSS 变量覆盖的方式进行自定义。 2. 创建或编辑Element-Plus的主题样式文件 首先,你需要在项目中创建一个新的 SCSS 文件,用于定义你想要覆盖的 Element-...
通过 SCSS 变量 通过 生成css文件引入index.html 已被废弃。通过css变量 通过正则覆盖element-plus/dist/...
Element Plus Version: 2.3.7 Browser / OS: Google Chrome /14.0.5735.134 Build Tool: Vite Reproduction Related Component el-form el-form-item Reproduction Link Github Repo Steps to reproduce 直接运行项目就能看到错误 What is Expected? 正常修改 form.scss 样式不报错 What is actually happening? 修改fo...