小四先生的云

文章参考下面两个 issues：提取公共依赖 doc、qiankun 如何复用公共依赖 思路 方式一：通过 CDN 引入公共依赖，并在 主子应用 中排除这些公共依赖。（如果 CDN网站 挂了，网站也就挂了，有风险） 方式二：将 CDN 资源下载到 public 文件夹下，并在 主子应用 中排除这些公共依赖 一般来说，只需要在 主应用 中引入即可，子应用 会复用主应用的资源，这个时候子应用单独访问（直接通过 http://localhost:8001/ 访问，而不是主应用路由点击）会报错，因为缺少依赖 如果需要 子应用 可以单独访问（直接通过 http://localhost:8001/ 访问，而不是主应用路由点击），那么也需要在 子应用 中引入，需要用到 ignore 关键字 项目地址创建项目初始化项目 项目目录结构 12345678910111213141516171819202122232425262728|── 项目根目录│ ├── packages # 包目录│ │ ├── app ...

React Flow React Flow 一个可定制的 React 组件，用于构建基于节点的编辑器和交互式图表 官网提供了大量示例，以及在线演示。建议看完每个示例，很有用！！！ 其他参考：Vue Flow 代码地址在线演示 自动布局示例 参考官网示例：Dagre Tree 使用 Dagre 时注意事项 Dagre 布局算法需要指定节点的宽和高，否则会报错 @dagrejs/dagre v1.1.4 在老版浏览器 (eg: chromev89.0.4389.90) 会报 Object.hasOwn is not a function 错误，降级为 @dagrejs/dagre v1.1.3 即可解决 官网示例下面有公开的代码，此处不再贴出代码 复制粘贴示例 参考官网示例：Copy and...

React Compiler React Compiler 是目前在 RC 中的一个新编译器，会自动记住你的代码，避免忘记或者错误的使用 useMemo、useCallback、React.memo 等 React 的 API 项目地址创建 React Compiler 应用新建一个项目1234567891011# 通过 vite 创建项目npm create vite@latest# Project name:react-compiler# Select a framework:React# Select a variant: (这里一定要选择 TypeScript, 因为 TypeScript+SWC 还没有适配)TypeScript 安装配置依赖 安装 babel-plugin-react-compiler 和 eslint-plugin-react-hooks 12npm install --save-dev --save-exact babel-plugin-react-compiler@rcnpm install --save-dev...

Node Cli 常用工具介绍 @clack/prompts : 用于命令行交互 picocolors : 用于输出样式 unbuild : 用于打包项目 仓库地址项目实践项目目录12345├── node-cli ├── .gitignore # git 忽略文件 ├── index.js # 入口文件 ├── package.json # 项目配置 ├── README.md # 项目说明 配置项目 初始化项目 1npm init -y 修改 package.json 文件内容如下 12345678910111213141516{ "name": "create-yourname-app", // 项目名称 npm i create-yourname-app -g "version":...

介绍 Lerna 是一个快速、领先的构建系统，用于管理和发布来自同一源码仓库的多个 JavaScript/TypeScript 软件包 Qiankun 是一个基于 single-spa 的微前端实现库，在帮助大家能更简单、无痛的构建一个生产可用微前端架构系统 Vite 是一个超快的前端构建工具，赋能下一代 Web 应用的发展 思路 主应用 app 配置四个菜单 App、 App1、App2、App3 菜单 App 链接主应用 app，可以调用子应用 app1、app2、app3 菜单 App1 链接子应用 app1，样式未隔离，组件库样式未隔离 菜单 App2 链接子应用 app2，样式未隔离，组件库样式隔离 菜单 App3 链接子应用 app3，样式隔离，组件库样式未隔离 项目地址实践包版本 node: 18.20.7 npm: 10.8.2 lerna: 8.1.8 vite: 6.1.0 qiankun: 2.10.16 node 版本小于 18 注意以下几点 所有应用 使用 Vite: 5.4.11 所有子应用 安装...