🎨 前端 - 样式定制

ThinkAdmin 提供完善的样式定制功能，基于 Less 预处理器实现样式的二次修改和编译。

🚀 主要功能

• Less 支持: 基于 Less 预处理器进行样式开发
• 二次修改: 支持对现有样式进行二次修改
• 自动编译: 支持 Less 到 CSS 的自动编译
• 主题定制: 支持主题样式的自定义
• 响应式设计: 支持响应式样式的定制
• 开发友好: 提供友好的样式开发环境

⚠️ 重要提示

编译要求: 样式修改之后需要重新使用 lessc 编译生成 css 文件，并清除浏览器缓存！

Node.js 环境: 需要安装 Node.js 环境，确保可以执行 npm 指令。

📋 技术架构

Less 预处理器

• 编译生成: 后台管理界面样式由 lessc 编译生成
• 二次修改: 支持对现有样式进行二次修改
• 变量支持: 支持 Less 变量和混入功能
• 嵌套语法: 支持 Less 的嵌套语法

编译环境

• Node.js: 需要安装 Node.js 环境
• npm 支持: 确保可以执行 npm 指令
• 依赖管理: 通过 package.json 管理依赖
• 构建脚本: 提供便捷的构建脚本

🔧 开发流程

1. 环境准备

• 安装 Node.js: 确保可以执行 npm 指令
• 进入目录: 进入样式目录 public/static/theme/css/
• 检查文件: 确认存在 package.json 文件

2. 依赖安装

cd public/static/theme/css/
npm install

3. 样式编译

npm run build

4. 缓存清理

• 浏览器缓存: 清除浏览器缓存
• CDN 缓存: 清除 CDN 缓存（如果使用）
• 服务器缓存: 清除服务器缓存