您当前的位置：主页 > 技术探讨 >

react框架配型

时间：2020-03-14 21:34 日记人：arlen.zhou

React 是一个用于构建用户界面的 JAVASCRIPT 库。

React 主要用于构建UI，很多人认为 React 是 MVC 中的 V（视图）。

React 起源于 Facebook 的内部项目，用来架设 Instagram 的网站，并于 2013 年 5 月开源。

React 拥有较高的性能，代码逻辑非常简单，越来越多的人已开始关注和使用它。
当然各位看官使用时可以随着项目的需求随意添加，但大体项目框架架构配型可以围绕我所推荐的去构建。
技术框架的配型取决于使用者对项目的分析，项目的需求不同，对应的UI框架不同，辅助性工具也可以随之选择所取,当前生态react架构中，react-hooks的方式逐渐在替代，原生命周期的方式，大家的技术状态也要与时俱进啊，具体详情可以后期关注。
 

PC电脑端系统配型：react+axios+less+webpack+md5+redux+ant+router5.2+node+echarts+crypto-js+http-proxy-middleware+CSS Modules

1. axios:Axios 是一个基于 promise 的 HTTP 库，可以用在浏览器和 node.js 中。
2. less:Less 是一门 CSS 预处理语言,它扩展了 CSS 语言,增加了变量、Mixin、函数等特性
3. md5: md5是一种信息摘要算法，它可以从一个字符串或一个文件中按照一定的规则生成一个特殊的字符串，并且一个文件所对应的MD5摘要是固定的，当文件内容变化后，其MD5值也会不一样，因此，在应用中经常使用MD5值来验证一段数据有没有被篡改。一般用作账号加密。
4. redux：react生态状态管理器，和vue生态状态管理器vuex类似，当然也可以在其他生态使用，这里不做详细介绍。
5.  ant ：蚂蚁金服开源UI框架，企业级产品设计体系，创造高效愉悦的工作体验
6. echarts： 数据图视图化工具
7. crypto ： 前端可逆向加密工具，一般用于权限或私密加密管理，可搭配项目全局管理器进行使用
8. http-proxy-middleware：本地代理解决服务器代理问题
(附赠小礼品)
h5框架css 兼容

html {
    font-size: 16px !important;
}
 
@media screen and (min-width: 375px) {
    html {
        font-size: calc(100% + 2 * (100vw - 375px) / 39) !important;
        font-size: calc(16px + 2 * (100vw - 375px) / 39) !important;
    }
}
@media screen and (min-width: 414px) {
    html {
        font-size: calc(112.5% + 4 * (100vw - 414px) / 586) !important;
        font-size: calc(18px + 4 * (100vw - 414px) / 586) !important;
    }
}
@media screen and (min-width: 600px) {
    html {
        font-size: calc(125% + 4 * (100vw - 600px) / 400) !important;
        font-size: calc(20px + 4 * (100vw - 600px) / 400) !important;
    }
}
@media screen and (min-width: 1000px) {
    html {
        font-size: calc(137.5% + 6 * (100vw - 1000px) / 1000) !important;
        font-size: calc(22px + 6 * (100vw - 1000px) / 1000) !important;
    }
}