License Angular TypeScript Tailwind CSS TanStack Query

基于 Angular 21 + Tailwind CSS 4 的现代化中文后台管理系统,使用 Standalone Components、Signals 和 TanStack Query 构建。

• 在线预览:https://halolight-angular.h7ml.cn
• GitHub:https://github.com/halolight/halolight-angular

• Angular 21 + TypeScript:使用最新 Standalone Components 和 Signals API
• 响应式状态:Angular Signals (signal, computed, effect) + RxJS
• 新控制流语法:@if、@for、@switch、@defer
• Tailwind CSS 4:原子化样式、CSS 变量主题系统
• 自定义 UI 组件:shadcn 风格组件库
• 可拖拽仪表盘:angular-gridster2 支持布局持久化
• ECharts 图表:主题自适应配色
• TanStack Angular Query:强大的数据获取和缓存
• Mock.js 集成:环境变量一键启用

src/app/
├── app.ts # 根组件 (Standalone)
├── app.config.ts # 应用配置 (Providers)
├── app.routes.ts # 路由配置
├── core/ # 核心模块
│ ├── guards/ # 路由守卫
│ ├── interceptors/ # HTTP 拦截器
│ └── services/ # 单例服务
├── shared/components/ui/ # UI 组件
├── features/ # 功能模块
├── layouts/ # 布局组件
└── environments/ # 环境配置

环境要求:Node.js 20.19+ 或 22.12+

npm install
npm start # 开发模式 http://localhost:4200
npm run build # 生产构建
npm test # 运行测试

• Standalone Components:无需 NgModule
• Signals:signal(), computed(), effect(), model(), input(), output()
• 新控制流:@if, @for, @switch, @defer
• View Transitions:页面切换动画
• Function-based Guards/Interceptors

MIT