创建项目
这里还是使用create-react-app的官方脚手架创建项目
npx create-react-app react-standard --templete typescript
创建成功后,看下目录结构。结构不缀诉.主要看下版本
我创建的时间是2022年4月,当前执行命令后,关键库的版本:
react:v18webpack:v5.64
修改目录
根据需求再src目录下修改和创建了以下目录结构
components:无状态的公共组件,不包含业务,可以在其他项目中重用constants:可以复用的公共常量containers:有状态组件,包含业务,可在本项目中重用contexts:存放全局状态的React.contextsmodels:TS模型network:网络接口,对后端接口的封装,暴露参数和返回值pages:项目的业务逻辑代码reducers:reduxutils:公共函数目录
总结
到此为止,一个基于TS和React的项目目录已经初步完成