umi
文章平均质量分 54
椰卤工程师
这个作者很懒,什么都没留下…
展开
-
【避坑指“难”】umi3分包优化,提升首屏加载时间
提升首屏加载时间原理:把大体积的包,分成多个小体积的包进行加载,减少请求时间chainWebpack配置在 umi.js 或者 umi.ts 或者 .umirc.js 或者 config.js 中配置,使用 webpack 的优化模块optimization.splitChunks实现。chunks配置chunks 配置需要加上 umi,否则打包完后依旧是白屏,在控制台可看到 umi.js 和 umi.css 并没有引入。compression-webpack-plugin服务端使用gz.原创 2022-05-24 12:11:21 · 2748 阅读 · 1 评论 -
【避坑指“难”】react+umi权限控制一网打尽(路由权限and按钮权限)
权限控制是业务中最最最最最常见的,通常B端需要对不同的用户配置不同的权限,相应的按钮也仅开放给部分用户可见,下面是权限控制的实现方式。一、菜单权限及路由权限1、config/routes.tsx添加access权限控制标识{ path: '/userCenter', name: '个人中心', access: 'userCenter', icon: 'GroupOutlined', hideInMenu: true, routes: [ {原创 2022-01-09 22:26:47 · 4622 阅读 · 0 评论 -
React企业级项目实战2——umi框架
umi是⼀个可插拔的企业级 react 应⽤框架。一、为什么用umi?开箱即用,内置 react、react-router 等类 next.js 且功能完备的路由约定,同时支持配置的路由⽅方式完善的插件体系,覆盖从源码到构建产物的每个生命周期高性能,通过插件支持 PWA、以路由为单元的 code splitting 等支持静态⻚面导出,适配各种环境,⽐如中台业务、⽆线业务、egg、⽀付宝钱包、云凤蝶等开发启动快,⽀持⼀键开启 dll 和 hard-source- webpack-plugin原创 2021-01-16 12:35:40 · 1480 阅读 · 0 评论 -
Umi与Dva结合传递仓库数据
Dva如何与Umi结合的?插件@umijs/plugin-dva复制model用例:model.ts把interface都删掉改名UserModel第一步:剪切index.tsx中的data数据到moedel.ts的reducers下删掉下面的代码,直接返回data第二步:实现connect index.tsx标准的Redux连接方式model.ts少了一个触发的过程将订阅里面的根目录换成usersquery异步换成同步出现报错值传到了index原创 2020-09-25 16:56:43 · 455 阅读 · 0 评论