AntDesignPro开发手册.docx

An tDesig nPro 开发手册
修订历史记录
日期
版本
说明
作者
目录
1.
、八—
刖言
目的
让不熟悉Ant Design Pro 的开发人员快速掌握开发方式
概述
An t Desig n Pro 是一个前端设计解决方案，由蚂蚁金服体验技术部出品 /维
护。
核心技术组成：
ES2015+ JavaScript 语言的新标准
React用于构建用户界面的 JAVASCRIPT库
dva 是基于（redux （状态管理）+ react-router （路由库）+ redux-saga
（异步中间件） 等） 的一层轻量封装
g2 一套基于可视化编码的图形语法
antd React 组件
2. 开发环境
安装配置
安装包及源码下载地址为：
安装方式
cd my-project
npm install ant-design-pro-cli -g # 安装脚手架
mkdir my-project
cd my-project
pro new # 创建一个新项目
目录结构
I ock #本地模拟数据
I ublic #公共资源
I 1 #网站图标
I rc
assets
# 本地静态资源
common
# 应用公用配置，如导航信息
components
# 业务通用组件
e2e
# 集成测试用例
layouts
# 通用布局
models
# 数据交互
routes
# 业务页面入口和常用模板
I I ervices #后台接口服务
I I tils #工具库
I I—— #可视化图形配置
I I—— #主题配置
I I # HTML 入口模板
I I #应用入口
I I #全局样式
I 1 #路由入口
I ests #测试工具
I—— #项目说明
1—— #项目配置文件
项目初始化
npm install
npm start
npm run build
该命令会生成 *.js 、 *.css 、 等静态文件
3. 开发指导
开发规范
开发流程示意图
开发实例
新建一个菜单
菜单配置文件 src/common/ ，在 menu