Vue项目如何实现网站的一键换肤

Question

Vue项目如何实现网站的一键换肤

项目是css样式是使用的less，并且是写在.vue 文件中的
请问如何实现一键整体更换网站颜色

Answer 1

把涉及换肤的样式提取出来-》 basicSkin.less , 再加上其他 color-*.less ，在里面引入 basicSkin.less，可以通过全部引入，然后外层设置 颜色id 来区分样式；或者通过判断来动态引入 样式

Answer 2

css自定义属性 + css-vars-ponyfill(解决兼容性)

css自定义属性： https://developer.mozilla.org...
css-vars-ponyfill: https://github.com/jhildenbid...

Answer 3

更换css样式表

Answer 4

Vue 换肤实践

Answer 5

css-modules + vuex

Answer 6

本质就是修改样式表啊。方案太多了，具体看项目，怎么方便怎么来。