AdminLTE 完整指南：基于 Bootstrap 5 的免费后台管理模板，10 分钟上手

AdminLTE 完整指南：基于 Bootstrap 5 的免费后台管理模板，10 分钟上手

【免费下载链接】AdminLTEAdminLTE - Free admin dashboard template based on Bootstrap 5项目地址: https://gitcode.com/GitHub_Trending/ad/AdminLTE

AdminLTE 是一款基于 Bootstrap 5 框架的免费管理仪表板模板（admin dashboard template），它把后台系统最常用的侧边栏、顶栏、卡片、表格、表单等界面模块都预先做好了，并支持从手机到桌面的全尺寸响应式布局。如果你正在为内部系统、SaaS 产品或运营平台从零搭建管理界面，AdminLTE 可以帮你跳过"画页面"的环节，直接进入业务开发。

搭建后台界面，你被这三个问题卡过吗

做过后台系统的人大概都有同样的体会：接口调通了，数据也有了，可前端页面却迟迟出不来。

• 布局难统一：侧边栏、顶栏、内容区怎么排？手机端菜单怎么收起？这些细节每个项目都要重新想一遍。
• 样式要匹配：企业色、字体、间距、暗色模式……一套规范没落地，界面就"不专业"。
• 组件要重造：统计卡片、数据表格、登录注册页，看起来简单，真正写好细节很费时间。

AdminLTE 的思路是：这些"通用部分"全部做好，你只需要替换成自己的数据。

三步完成部署：克隆、安装、启动

整个过程只需要 Node.js 环境，三步即可看到运行效果：

git clone https://gitcode.com/GitHub_Trending/ad/AdminLTE cd AdminLTE npm install

安装完成后启动开发服务器：

npm run dev

浏览器访问http://localhost:3000就能看到完整的仪表板演示页面，修改样式或页面代码后会自动刷新，适合边看边改。当你准备上线时，用npm run production可以一次性编译出压缩后的 CSS/JS 和静态页面，放到 dist 产物 对应的发布目录即可。

开箱即用的组件：覆盖后台 80% 的界面需求

项目里的示例页面就是最好的组件说明书，直接打开源码就能照着抄：

• 信息小部件（Info Box）：展示单个关键指标，如在线用户数、今日销售额，见 widgets/info-box.astro。
• 小型盒子（Small Box）：色彩醒目的汇总数据块，仪表板首屏常用，见 widgets/small-box.astro。
• 卡片（Cards）：后台内容的基本容器，支持标题、工具栏、页脚等完整结构，见 widgets/cards.astro。
• 表格与表单：数据展示和录入两类页面在 tables/simple.astro 和 forms/general.astro 里都有现成写法。

交互能力由 src/ts/ 目录下的 TypeScript 模块提供，侧边栏推送菜单、树形导航、卡片折叠、全屏切换等都封装成了独立小模块，不需要的功能可以整个不引入。

定制布局与主题：两个入口改全局

后台模板好不好用，最终看"改起来快不快"。AdminLTE 把定制入口收敛到了两个地方：

布局结构：固定侧边栏、折叠侧边栏、RTL 从右到左布局、迷你侧边栏等形态，在 src/html/pages/layout/ 下每个形态对应一个示例页，照着body标签上的类名就能切换。

样式变量：主题色、字体、圆角、间距等全部集中定义在 src/scss/_variables.scss，改一行变量、重新编译，全站风格就变了。暗色模式的变量在 _variables-dark.scss 中单独维护，与 Bootstrap 5 的data-bs-theme机制对齐，切换明暗模式不需要写额外的 JS。

开始用之前，先知道这几件事

• 版本：当前版本为 4.0 系列（见 package.json），构建工具链基于 Sass + Rollup + Astro，浏览器支持与 Bootstrap 5 一致（详见 browser-support.mdx）。
• 文档站：示例页面本身兼作文档，介绍、FAQ、主题定制、贡献指南都在 src/html/components/docs/ 中，npm run dev时可直接在线阅读。
• 协议：采用 MIT 开源协议（见 LICENSE），可自由用于商业项目。

别再把时间花在画管理界面上了——克隆仓库，跑起来，然后专心做你的业务。

【免费下载链接】AdminLTEAdminLTE - Free admin dashboard template based on Bootstrap 5项目地址: https://gitcode.com/GitHub_Trending/ad/AdminLTE