Element-UI换肤解决方案

Vue 之ElementUI
换肤的解决方案，网络上有很多，这里就不去一一赘述。这里直接用ElementUI给的解决方案使用下载样式，简单粗暴。然后全局替换下载的ElementUI样式中的color和background-color值然后直接将替换好的样式直接link到head上

ElementUI 动态换肤：theme-chalk-preview

注意的问题：
有的时候我们会对ElementUI样式进行重写。那么这个时候如果没有自定义class去包裹ElementUI的class去写的话，就会造成，直接你重写的样式被直接覆盖。

1、对于覆盖自己自定义ElementUI的样式，最好直接自定义包裹的class内。去覆写ElementUI样式。或者直接加!important. 因为上述锁了直接回color和backgound-color进行替换，所以对颜色之外的进行加!important,是没关系的。当然直接怼颜色加!important 也没关系，因为会直接替换color。所以换肤依然可以

2、有的ElementUI组件换肤没有生效。那就看看。是否加了color或者background-color这种需要换颜色的属性。因为换肤的原理是对ElementUI组件的颜色属性进行替换，如果你没有生效，那么就是你没有加color或者background-color，当然要加class去添加样式。切勿直接在dom上style。

3、以上只是修改颜色。且只对ElementUI的组件样式修改。自定义的则执行根据选中的颜色进行替换

4、对于i标签增加的图标也是可以换肤的，同样的加class然后添加color即可。

换肤解决方案特记录之！

千里之行
始于足下