【源码】基于 antd、antd pro 和 umijs（v4）的管理系统

项目简介

本项目是基于 antd、antd pro 和 umijs（v4）框架构建的管理系统。项目融合 DvaJS 进行数据流管理，使用 UnoCSS 处理样式。支持多种布局方案，具备路由数据加载和国际化功能，同时采用代码规范工具确保代码质量。

项目的主要特性和功能

主要特性

1. 技术框架：采用 antd、antd pro 和 umijs（v4），提供丰富 UI 组件与高效开发体验。
2. 数据流管理：支持 useModel 和 DvaJS 两种方式，适配不同复杂度场景。
3. 布局方案多样：有默认布局、umi 自带布局插件、插件布局等，可灵活配置菜单和路由。
4. 路由数据加载：在.umirc.ts 中开启 clientLoader 配置实现。
5. 样式处理：使用 UnoCSS，可在官网查询属性或自定义样式。
6. 国际化支持：框架提供三种国际化方式。
7. 代码规范：用 eslint、stylelint 规范代码，prettier 格式化代码，EditorConfig 统一编码风格，husky 规范 commit 提交。

主要功能

可灵活配置菜单和路由，支持动态获取菜单数据。具备基本管理系统功能模块，如用户管理、数据展示等，具体功能可按需扩展。

安装使用步骤

环境要求

• 包管理器：推荐 pnpm，也可用 yarn，不推荐 npm。
• npm 源：推荐 taobao 源。
• node 版本：18.12.1

安装插件

建议安装以下 vscode 插件： - prettier - EditorConfig for VS Code - UnoCSS

安装依赖

在项目根目录下，根据所选包管理器执行命令： - pnpm：pnpm install - yarn：yarn install

项目配置

• 布局配置：可修改 src/layout/index.tsx 自定义默认布局，或在 app.tsx 中配置 umi 自带布局插件。
• 路由数据加载：在.umirc.ts 中开启 clientLoader: {} 配置。

启动项目

在项目根目录下执行启动命令： - pnpm：pnpm start - yarn：yarn start 启动成功后，在浏览器中访问项目。

下载地址

点击下载 【提取码: 4003】【解压密码: www.makuang.net】