vue 项目换肤方案

104 阅读1分钟

方案一:预置多套主题

  • 新建theme文件夹编写主,题文件,将各个模块的每个主题颜色通过scss变量配置生成,可以减少代码量,方便新增修改主题,将项目拆成模块,方便后期颜色修改,易于维护,我觉得看起来也比较舒服

image.png

  • 预编译scss文件,也就是我们的主题文件

image.png

  • 项目中使用

image.png

  • 主题切换,给body加类名,index.scss中定义的主题类名

image.png

参考文章