Ant-design-pro-环境搭建

wellknow

前期准备
安装node、git (自行百度)
>node -v
$ y% v7 G/ [+ i% O; H9 ?$ r  v16.20.2
0 O2 c" @, t- o
安装
从github仓库中直接安装最新的脚手架代码
" Z3 S4 J: ?) |/ ]

1. git clone --depth=1 https://github.com/ant-design/ant-design-pro.git
   
2. cd ant-design-pro

复制代码

+ Y) I, T' F0 h% x# u# W0 w) D6 X目录结构

├── config                   # umi 配置，包含路由，构建等配置
├── mock                     # 本地模拟数据
1 H1 t, d( D* x3 a├── public
0 A. r7 S+ H" ^  i! L. x│   └── favicon.png          # Favicon
( R, L( `% e9 k├── src
│   ├── assets               # 本地静态资源
; f* p1 s' O5 Y5 N8 Q( @" L3 a3 @│   ├── components           # 业务通用组件
8 _5 c# n' x% n& s2 P. w+ ~  }│   ├── e2e                  # 集成测试用例
│   ├── layouts              # 通用布局
6 @3 C2 N1 e8 v% q0 E1 G4 h* X│   ├── models               # 全局 dva model
│   ├── pages                # 业务页面入口和常用模板
* J' J9 P7 y( p" ~9 c! V│   ├── services             # 后台接口服务
│   ├── utils                # 工具库
│   ├── locales              # 国际化资源
* L3 T% @- L2 A+ [9 m4 |7 w│   ├── global.less          # 全局样式
  k6 k8 ]# o0 E7 |" m5 G0 X9 [│   └── global.js            # 全局 JS
├── tests                    # 测试工具
├── README.md
└── package.json

4 _6 K: O1 I3 F) e" E# Y本地开发
安装依赖

1. npm install yarn -g
   . i/ D& N9 d! Q  O( a
2. yarn install
   - y) I8 `5 J3 Z( y$ ?; d
3. yarn start

复制代码

启动完成后会自动打开浏览器访问
# _, Z8 b6 @4 H! Phttp://localhost:8000