背景
現在公司的主要技術棧是React,所以也想著能夠搭建一個好的React前端框架，方便在工作中使用。主要用到的庫。
- React、TypeScript
- React-Router、Redux
- Antd、Less
- Axios、Mockjs、http-proxy-middleware
- Webpack、Babel、Eslint、Prettier
功能
- 登錄 注銷 演示頁面
- 全局功能
動態側邊欄
多頁面切換- Redux狀態管理
- Mocker 數據
- webpack 打包優化 antd按需加載
- hooks
項目效果
登錄
主菜單
項目結構說明
├── README.md
├── craco.config.js
├── mocker
├── package-lock.json
├── package.json # package.json
├── public # 靜態資源
├── src
│ ├── assets #靜態資源
│ │ ├── images #圖片
│ │ └── style #全局樣式
│ ├── component
│ ├── config #全局配置
│ │ ├── index.ts
│ │ ├── menu.ts
│ │ └── routes.ts
│ ├── index.tsx #入口文件
│ ├── logo.svg
│ ├── pages #頁面
│ │ ├── 404 #404頁面
│ │ ├── frame #框架頁面
│ │ │ ├── appRouter.tsx
│ │ ├── home
│ │ ├── login #登錄頁面
│ ├── services #接口
│ ├── store #全局stores
│ │ ├── index.ts
│ │ └── types.ts
│ └── utils #工具類
├── tsconfig.json
└── yarn.lock
目錄
引言
第一章：項目創建、antd、less
第二章：路由攔截、路由嵌套
第三章：狀態管理 Redux
第四章：網絡請求、代理、mockjs
第五章：webpack配置
第六章：Eslint
