自己搭建的基于 React + Redux + Antd + Immutable 的前端项目,同时支持单元测试和集成测试, 支持 CI 以及 docker 部署，目前还在不断完善中，希望大佬们捧场给个 Star

V2EX = way to explore

V2EX 是一个关于分享和探索的地方

现在注册

已注册用户请登录

• 请不要在回答技术问题时复制粘贴 AI 生成的内容

这是一个创建于 1289 天前的主题，其中的信息可能已经有所发展或是发生改变。

自己搭建的基于 React + Redux + Antd + Immutable 的前端项目,同时支持单元测试和集成测试, 支持 CI 以及 docker 部署，目前还在不断完善中，希望大佬们捧场给个 Star

项目地址 React-Delicacies

React-Delicacies

基于 React, Redux, React-Router, Immutable 的前端脚手架

关于主要技术栈

基于主流的 React,React-Router 进行项目开发,使用 Redux 进行状态管理,使用 Immutable 进行优化
基于 redux-thunk 处理 action 异步问题,关于 action 的调用顺序如有需要请使用自研中间件 redux-controlled-promise,使用方式请看官方文档
基于 Jest 和 Enzyme 提供完善的单元测试和集成测试, 复杂场景冒烟测试可自己安装相应依赖
支持第三方平台 Mock 数据
完善的 Axios 请求封装以及规范的错误处理

关于前端自动化

本项目基于 Webpack 实现前端自动化
- 支持 Antd, moment, lodash 等常用库的 tree-shaking
- 每一个 Router 作为一个 chunk 进行懒加载,代码拆分,减少包的体积
- 抽离公共代码配合 hash 持久化, 加快用户访问速度
- 为模块提供编译中间缓存, 提升二次编译速度
- 生产环境提供 gzip 的代码压缩,不耗费后端服务器的的 CPU 进行压缩
- Webpack hash 持久化,配合 HTTP 缓存提高访问效率
- 支持 CSS Module
- 支持 Less 等预编译语言,规范书写 mixins,管控 variables
- 配合第三方 CDN 提高浏览器资源请求效率
- 支持 Webpack 多进程, 提升编译以及打包速度

关于开发体验以及规范

Eslint 和 Prettier 完美结合,支持 React, Jsx, Js, Jest 等的语法检测,以及完美的代码格式化,编写体验非常棒
Stylelint 检测 CSS,Less 等语法,保证样式书写规范
commit 之前,自动对暂存区代码修复以及检测,把守好代码最后一道关口
CI CD 持续集成,保证代码质量

关于分析报告

可以输出完善的测试报告分析测试覆盖率
支持命令行查看打包分析报告

关于项目部署

支持使用 Docker 和 Nginx 进行部署

14 条回复 • 2021-06-17 09:17:05 +08:00

mightofcode

2021-06-16 10:43:25 +08:00

这是做啥的？

chrispaullhk

2021-06-16 11:16:33 +08:00

@mightofcode 可以拿来直接做项目实现需求了基础的架子都已经搭建好了

longgediyi999

2021-06-16 11:32:46 +08:00

整个预览地址牙

Imindzzz

2021-06-16 11:51:05 +08:00

没有 TS ？？没有 TS ？？没有 TS ？？

usercao

2021-06-16 12:02:52 +08:00

还在用 Redux ？？还在用 Redux ？？还在用 Redux ？？

Imindzzz

2021-06-16 12:03:56 +08:00

redux 算是第一代状态管理了吧，这个真不行，开始我宁愿挂到 window 里我都不愿用这个。
第二代是 mobx，这个集中管理，用了一段时间，就是使用还要注入，缺少类型提示，勉强用着。
第三代 react16 推出了 hook，就有了这个 https://www.npmjs.com/package/unstated-next 。可以说已经完美了。

chrispaullhk

2021-06-16 12:08:17 +08:00

@longgediyi999 地址有的 https://github.com/chris-paul/react-delicacies