开箱即用的中台前端/设计解决方案。
- 🛡 TypeScript: 应用程序级 JavaScript 的语言
- 💎 优雅美观：基于 Ant Design 体系精心设计
- 🚀 最新技术栈：使用 React/umi/antd 等前端前沿技术开发
- 🌐 国际化：内建业界通用的国际化方案
- 🔢 Mock 数据：实用的本地数据调试方案
- ⚙️ 最佳实践：良好的工程实践助您持续产出高质量代码
- 🔐 优秀的权限设计：目前能找到的最好的权限实现方案
- 微前端版本 micro-frontends-template 正在同步开发中...
- 好用的水印组件 watermark
├── config # umi 相关配置 ├── docker # docker 相关配置 ├── mock # 本地模拟数据 ├── public # 静态资源 ├── src # 源代码 │ ├── assets # 本地静态资源 │ ├── common # 类型定义、常量 │ ├── components # 全局公用组件 │ ├── config # 全局配置 │ ├── layouts # 布局文件 │ ├── locales # 国际化资源 │ ├── models # 路由 │ ├── pages # 业务页面入口和常用模板 │ ├── services # 所有请求 │ ├── utils # 全局公用方法 │ ├── app.tsx # 运行时配置文件 │ ├── authority.ts # 权限定义文件 │ ├── global.less # 全局样式 │ └── typings.d.ts # 补充类型定义 ├── package.json # package.json └── tsconfig.json # tsconfig.json 基于 umi-plugin-authority 提供权限功能，暴露 useAuthority hooks 和 Authority 组件实现权限控制的能力
使用示例如下
import React from 'react'; import { useAuthority, Authority } from 'umi'; const PageA = props => { const { foo } = props; const { combinationVerify } = useAuthority(); // 使用 hooks 提供的能力 if (combinationVerify('module1/action1')) { // 存在 module1/action1 权限，则... } return ( <div> {/** 指定需要验证的权限 */} <Authority access="module1/action1" fallback={<div>Can not read foo content.</div>} > Foo content. </Authority> {/** 直接指定权限 */} <Authority accessible={combinationVerify('module1/action1')} fallback={<div>Can not update foo.</div>} > Update foo. </Access> {/** 复杂的校验 */} <Authority accessible={combinationVerify('(module1/action1 || module1/action2) && module1/action3')} fallback={<div>Can not update foo.</div>} > Update foo. </Access> {/** children 为function */} <Authority accessible={combinationVerify('module3/action1')} fallback={<div>Can not delete foo.</div>} > {(isMatch) => <span>权限校验结果: {isMatch}</span>} </Authority> </div> ); };# 克隆项目到本地 git clone git@github.com:ts-react/react-admin-template.git # 切换到项目目录 cd ./react-admin-template # 安装依赖 yarn # 启动服务 npm run start现代浏览器及 IE11。
 IE / Edge |  Firefox |  Chrome |  Safari |  Opera |
|---|---|---|---|---|
| IE11, Edge | last 2 versions | last 2 versions | last 2 versions | last 2 versions |
| Github Issue | 钉钉群 | 微信群 |
|---|---|---|
| issues |  |  |