自定义博客皮肤VIP专享

*博客头图:

格式为PNG、JPG,宽度*高度大于1920*100像素,不超过2MB,主视觉建议放在右侧,请参照线上博客头图

请上传大于1920*100像素的图片!

博客底图:

图片格式为PNG、JPG,不超过1MB,可上下左右平铺至整个背景

栏目图:

图片格式为PNG、JPG,图片宽度*高度为300*38像素,不超过0.5MB

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+
  • 博客(9)
  • 收藏
  • 关注

原创 qiankun 入门(react和vue)

一、umi使用qiankun 插件使用方式一、主站1.安装插件yarn add qiankun # 或者 npm i qiankun -S2.配置qiankun开启2.1注册子应用a. 插件构建时配置子应用umirc.ts qiankun: { master: { // 注册子应用信息 apps: [ { name: 'app1', // 唯一 id entry: '//localhost:700

2022-05-06 22:34:53 697

原创 qiankun问题排查记录

一、问题描述1.项目相关配置: umi + qiankun + ahooks, 在项目开发过程中碰到这样一个场景:条件改变列表进行筛选并使用useUrlState改变url参数,结果发现操作一次页面被渲染2次2.复现方式: umi + qiankun(2.4.0以下版本), 注册qiankun:{master:{}},然后更新history就会触发二、问题排查排查思路: 组件—页面, 业务逻辑— 相关api—依赖 顺序来排除1.组件逻辑排查2.页面逻辑排查3.相关api及配置 排查1.ap

2022-05-06 22:33:57 665

原创 umi+qiankun如何使用Webpack5 模块联邦题】

前言官方文档:https://www.webpackjs.com/通过阅读文档,使用webpack 模块联邦有两个问题需要解决:异步导入react实例唯一,依赖共享​ 如果单纯在umi中使用模块联邦,可以使用umi插件的方式异步导入入口,依赖也可以使用shared来共享,但是这种方式在qiankun下使用会不兼容,在此我们主要说下umi+qiankun的思路, 对umi插件有兴趣可以翻下之前发的一个umi的文章思考:1、异步导入如何解决?​ 如果了解qiankun会知道,

2022-05-02 15:39:16 3014 2

原创 angular 入门

一、安装1.安装@angular/clicnpm i -g @angular/cli2.使用脚手架工具创建项目ng new angular-demo3.安装依赖cnpm install || cnpm i4.启动项目ng server --port 5000 --open创建新组件ng generate component NewComponentName6.创建模块ng generate module 模块名称7.创建服务ng generate service

2021-07-19 22:25:12 2393

原创 webpack之plugin编写 -- 从html-webpack-plugin源码的角度来看如何编写plugin

webpack之plugin编写 – 从html-webpack-plugin源码的角度来看如何编写plugin​ 准备写个webpack的plugin,打开官网文档https://www.webpackjs.com/contribute/writing-a-plugin,发现有点蒙圈,看完文档好像知道怎么写,但又写不出来,所以看下html-webpack-plugin的实现,从而整体了解下插件的整体流程一、html-webpack-plugin源码分析1.插件的作用这个插件都用过,它的作用可

2020-11-29 15:52:53 523

原创 webpack之tapable

webpack之tapable近期研究webpack loader和plugin编写,发现涉及到tapable,闲来无事翻翻源码结合使用方法记录一下原文 https://github.com/webpack/tapable/tree/master一、钩子类型tapable提供了很多钩子(Hook classes)const { SyncHook, // 同步钩子 从上到下顺序执行 SyncBailHook, // 同步早退

2020-11-29 08:16:38 174 1

原创 antd3 -- antd4 api差异之form组件

一.form组件1.使用方式1.antd3 使用需要注册 ..... const WrappedHorizontalLoginForm = Form.create({ name: 'horizontal_login' })(HorizontalLoginForm); 2.antd4 无需注册直接使用2.antd 4 api1.form 使用: const [fo...

2020-04-09 12:43:59 5006

原创 umi之路由系统

1.路由注册1.约定式路由通过文件路径来渲染2.配置式路由1.umi3 配置方式在配置文件routes进行配置,格式为数组export default { routes: [ { exact: true, path: '/', component: 'index' }, { exact: true, path: '/user', component: 'user' ...

2020-04-09 12:43:07 5662 2

原创 umi 项目配置

一、运行配置约定src/app.tsx为运行配置配置项目1.patchRoutes 修改路由,可获得整个路由系统export function patchRoutes({ routes }) { routes.unshift({ path: '/foo', exact: true, component: require('@/extraRoutes/foo')...

2020-04-09 12:41:31 15311 1

空空如也

空空如也

TA创建的收藏夹 TA关注的收藏夹

TA关注的人

提示
确定要删除当前文章?
取消 删除