vue3-elementPlus主题色定制_vue3自定义全局主题色

在src目录下的styles的文件夹中增加element文件夹，element文件夹下的index.scss
可定制自己喜欢的颜色

@forward 'element-plus/theme-chalk/src/common/var.scss' with (
    $colors:(
        'primary':(
            //主色
            'base':#27ba9b
        ),
        'success':(
            'base':#1dc779
        ),
        'warning':(
            'base':#ffb302
        ),
        'danger':(
            'base':#e26237
        ),
        'error':(
            'base':#cf4444
        ),
    )
)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20

然后在vite.config.js中增加红框中的配置

按钮由蓝色变成如下图所示的颜色说明配置成功