本文共 561 字，大约阅读时间需要 1 分钟。

Element Plus 原主题定制实现指南

一、自定义SCSS文件

在项目src/css/styles/element目录下新建index.scss文件。以下为代码示例：

@forward "element-plus/theme-chalk/src/common/var.scss" with (  $colors: (    "primary": (      "base": #d61b1a,      "color": #fff,    ),  ));@use "element-plus/theme-chalk/src/index.scss" as *;

$primary变量定义了我们主题的主要颜色（可以根据需求调整）。如果定义失败，建议检查主题配置文件。

二、在main.js中引入

将index.scss文件引入main.js中即可。在支持quasar框架的项目中，假设没有main.js文件，演示会省略。在实际应用中，带有type="primary"的el-button将使用自定义的#d61b1a主题颜色。

注意事项：

如果对该部分有更深的定制需求，可以在var.scss文件中进一步扩展主题样式。

转载地址：http://eeeyk.baihongyu.com/