前端项目搭建手册
介绍项目使用的类库和一些特殊 api 的处理方法,主要如下
- 项目的初始化
- 项目状态管理
- 项目的路由管理
- 前后端分离使用的mock数据思想
- 项目进行国际化的处理方案
项目的初始化
- 项目使用框架:React
- 项目初始化是使用antd-design的开发者脚手架 create-react-app 进行项目初始化
- 添加按需加载的配置文件,可以优化前端的性能
- 项目使用yarn 进行项目所需依赖进行下载
- 项目使用git 进行代码管理
项目状态管理
最初的react状态管理使用 contex 和props 进行结合,但是造成代码冗余,所以使用react-redux 进行项目管理
- 使用react-redux 进行项目状态的 集中管理
- 使用react-thunk 进行异步状态的管理
- 通过配置文件进行使用@content 的装饰器用法实现代码的更精简化
项目路由管理
- 使用react-router4进行路由管理
前后端分离使用的mock数据思想
- 使用json-server 进行数据模拟
- 可以更高效的进行前端后并行开发
- 支持标准的Resful 操作
- 支持标准的Resful路由规则
- 而且还有一些进阶扩展,可以自定义路由,中间件等
项目进行国际化的处理方案
在项目中使用 antd-design 社区提供的react-intl-universal,进行项目国际化语言处理,在这里要注意配置文件的存放位置,还有api的初始化成功或者失败的判断