前端dvajs与umijs

亦凉 2022-01-05 14:04 506阅读 0赞

![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzMyNDQ3MzAx_size_16_color_FFFFFF_t_70]  
**一、dvajs**  
开源地址：[https://dvajs.com/][https_dvajs.com]

1.dva  
dva 首先是一个基于 redux 和 redux-saga 的数据流方案，然后为了简化开发体验，dva 还额外内置了 react-router 和 fetch，所以也可以理解为一个轻量级的应用框架。

2.特性  
易学易用，仅有 6 个 api，对 redux 用户尤其友好，配合 umi 使用后更是降低为 0 API  
elm 概念，通过 reducers, effects 和 subscriptions 组织 model  
插件机制，比如 dva-loading 可以自动处理 loading 状态，不用一遍遍地写 showLoading 和 hideLoading  
支持 HMR，基于 babel-plugin-dva-hmr 实现 components、routes 和 models 的 HMR

**二、umijs**  
开源地址：[https://umijs.org/][https_umijs.org]

1.umi  
umi是一个基于路由的框架，支持next.js类似的传统路由和各种高级路由功能，例如路由级按需加载。凭借涵盖从源代码到构建产品的每个生命周期的完整插件系统，umi能够支持各种功能扩展和业务需求。目前，umi在社区和公司内部拥有近50多个插件。

umi是Ant Financial的基本前端框架，直接或间接地为600多个应用程序提供服务，包括Java，节点，移动应用程序，混合应用程序，纯前端资产应用程序，CMS应用程序等。umi为我们的内部用户提供了很好的服务，我们希望它能够很好地为外部用户服务。

2.功能  
? 开箱即用，内置支持反应，反应路由器等。  
?Next.js 喜欢和全功能的路由约定，它也支持配置的路由  
? 完整的插件系统，涵盖从源代码到生产的每个生命周期  
? 高性能，通过插件支持PWA，路由级代码分割等  
? 支持静态导出，适应各种环境，如控制台应用程序，移动应用程序，鸡蛋，支付宝钱包等  
? 快速启动启动，支持使用config 启用dll和hard-source-webpack-plugin  
? 与IE9兼容，基于umi-plugin-polyfills  
? 支持TypeScript，包括d.ts定义和umi test  
? 与深度集成DVA，支持鸭子目录，模型的自动加载，代码分裂等

![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzMyNDQ3MzAx_size_16_color_FFFFFF_t_70 1]

[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzMyNDQ3MzAx_size_16_color_FFFFFF_t_70]: /images/20211229/133c05159a284c9a9c27b9403e85c5fa.png
[https_dvajs.com]: https://dvajs.com/
[https_umijs.org]: https://umijs.org/
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzMyNDQ3MzAx_size_16_color_FFFFFF_t_70 1]: /images/20211229/9b56ef2b5c2147838d61640a4ebaac77.png