为了解决这个问题，看了十几篇文章，但可能是版本原因，要么不能用，要么超复杂。。。所以决定自己认真研究下，问题顺利解决了，分享出来让大家少走弯路
不废话直接上代码
document.documentElement.style.setProperty('--el-color-primary', '#f40')
想要什么颜色自己就设置什么颜色。效果如图：
如果只是为了实现效果，看到这里就足够了，想在哪里实现，就把这1行代码放哪里。不用怀疑，就是这1行，问题已经解决。当然，也可以封装在某个函数中，主题色作为参数动态获取，轻松实现动态配置主题的效果。
如果想进一步了解方法和原理，以便于更灵活地自定义主题，甚至在以后框架版本升级、旧方法不适用时还能自己找出新方法，可以继续往下看：
原理解析
灵感来源 —— element-plus官方文档的暗黑模式说给<html>标签设置一个class类名，再引入一行代码，就可以把项目改为「暗黑主题」
我很好奇这是怎么实现的，于是顺着路径找到了element-plus/theme-chalk/dark/css-vars.css文件，内容如图：
不难看出，设置暗黑主题的原理就是给<html class='dark'>标签设置样式，其中第一个样式color-scheme:dark;是打开浏览器的深色模式；第二个样式--el-color-primary:#409eff;就是设置主题色；
既然如此，问题就变得简单了，既然官方文档说可以通过在main.ts里加入一行代码import 'element-plus/theme-chalk/dark/css-vars.css'引入css文件实现暗黑主题，而这个css文件其实就是设置了一些css样式而已，那么我们是不是可以直接给<html>设置--el-color-primary样式，以达到自定义主题色的目的呢？
想到这我马上动手试了下，答案是肯定的！就是用的文章开头那行代码
document.documentElement.style.setProperty('--el-color-primary', '#f40')
实现了设置主题色的效果。
继续探索
以上说的是「设置主题色」
相对来说设置的条件比较单一，只能修改主要颜色。如果想多方位自定义主题（例如暗黑主题），参照以上思路，也很简单：
- 直接将源码中的
css-vars.css文件复制粘贴出来放到项目src文件夹中（或者其它位置，自己想放哪放哪） - 在这个文件里根据class类名写样式代码。提示：暗黑主题还可以自定义背景色，可设置为
#000全黑；可以写多种类名，类名里可以只写主题色，也可以写更详细的样式；
- 在main.ts里引入这个样式文件
- 在js逻辑代码里写
document.documentElement.className = 'normal'
就可以给<html>标签设置对应的class类名。
结束
自此，就完成了用极简方法实现「高度自定义主题样式」的效果！
第一次写文章，如果觉得方法好用，给个赞鼓励下哈哈~
