React后台启动器

admin-dashboard-template — React 后台模板

作者 tomtapia

React 19 + Vite 6 + TypeScript 后台模板，内置 RBAC、多租户、主题、i18n 与 MSW 模拟 API。

打开源站下载源码 ZIP

看看你的网站会是什么样

浏览真实页面截图，比较内容排版与手机效果。点击下方缩略图切换，放大查看整页细节。

1 个预览视图

补采画面存在空白、加载或排版异常，当前保留可用的原始预览。

仓库预览 1

访问演示网站在新标签页打开

作者提供的预览

来自项目仓库的原始界面图片。

目前有 1 张原始预览，可打开完整图片查看设计细节。

截图用于了解视觉与布局，交互效果请以实际项目为准。

采集于 2026-09-27查看来源

值得关注的模板亮点

从已有项目资料中，快速了解它的特点。

20 个路由页面，三级信息架构，全部懒加载并受保护壳包裹

内置 RBAC，导航可见性与路由守卫由单一 canAccess() 控制

多租户支持，请求携带 X-Tenant-Id，侧边栏顶部有品牌工作区切换器

完整模拟认证流程，含访问/刷新令牌、401 自动刷新重试、静默刷新

四套主题预设，基于 CSS 变量并默认遵循 prefers-color-scheme

MSW 模拟 API，零后端即可运行，设置 VITE_API_BASE_URL 可切换真实接口

模板详细介绍

这是一份以生产形态为目标的 React 19 + Vite 6 + TypeScript 后台管理模板，核心卖点是开箱即用的完整产品骨架：20 个路由页面、三级侧边栏、面包屑、命令面板，以及覆盖登录、仪表盘、邮件、日历、用户、账单等模块的页面结构。所有数据交互默认走 Mock Service Worker，因此克隆后无需后端即可体验完整流程，包括登录、租户切换和数据增删改。

模板在工程化上做了不少取舍：RBAC 通过统一的 canAccess() 控制导航与路由守卫，多租户以 X-Tenant-Id 头贯穿请求，主题提供四套预设并遵循系统偏好，i18n 内置英西法三种语言。质量方面配有 Vitest 与 Playwright 测试、Biome 检查以及 GitHub Actions 流水线，UI 组件基于 shadcn/ui 与 Radix，并声明遵循 WCAG 2.2 AA。对于需要快速搭建内部后台且重视代码规范与可访问性的团队，这份模板能省去大量前期搭建工作。

需要留意的是，项目仍处于 0.7.0 的 pre-1.0 阶段，README 明确列出尚未完成的生产级认证方案（当前 token 存于 localStorage）、服务端授权契约文档等。若计划直接上线，需自行核对认证安全性、后端 API 路径与真实数据模型，以及 Sentry 等可观测性配置。模板的 mock 层设计为通过设置 VITE_API_BASE_URL 即可切换真实后端，但前提是后端需实现相同的 /api/* 路径。

React后台启动器

适合你的项目吗？

适用场景

快速搭建内部管理后台或 SaaS 控制台原型
作为 React 19 + TypeScript 项目的架构参考，学习模块化组织与测试集成
需要多租户、RBAC、国际化等复杂功能起步的团队
演示或概念验证，无需后端即可展示完整交互流程

适合人群

熟悉 React 和 TypeScript 的开发者
需要完整后台骨架而非单页示例的项目
重视代码质量与可访问性（WCAG 2.2 AA）的团队
希望基于 shadcn/ui 风格定制 UI 的开发者

上手与定制指南

结合仓库当前版本的说明，按下面的资料检查内容、配置与运行要求。

1
需要 Node.js ≥ 22 和 pnpm ≥ 11。
2
克隆后运行 pnpm install 和 pnpm dev，访问 http://localhost:5173，点击 Continue as Avery Stone 即可体验。
3
切换真实后端需复制 .env.example 为 .env.local 并设置 VITE_API_BASE_URL，同时确保后端实现 src/mocks/handlers.ts 中定义的 /api/* 路径。
4
项目当前为 pre-1.0，生产使用前需核对认证安全性与服务端授权。

查看仓库使用说明

授权与来源资料

使用条件与限制

免费使用 · 保留许可声明

MIT许可证允许免费使用、复制、修改、合并、发布、分发、再许可和销售软件，仅需保留版权与许可声明。README仅确认MIT许可，无额外限制。

使用时需要遵守

保留原作者版权声明和 MIT 许可证声明。
在所有副本或实质性部分中包含上述版权声明和许可声明

查看原文依据

Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software
许可证原文