less切换主题

less切换主题

核心css变量，less变量

1. 定义主题less文件

// /assets/css/theme.less
// 默认的主题颜色
@primaryColor: var(--primaryColor, #000);
@primaryTextColor: var(--primaryTextColor, green);

// 导出变量 :export 形式导出
:export {
   
  name: "less";
  primaryColor: @primaryColor;
  primaryTextColor: @primaryTextColor;
}

2. 定义主题模式JS

// assets/js/model.js
export const themes = {
   
  default: {
   
    primaryColor: `rgb(${
     74}, ${
     144},${
     226})`,
    primaryTextColor: `rgb(${
     74}, ${
     144},${
     226})`
  },
  dark: {
   
    primaryColor