1.UmiJS 学习笔记 1 - 快速上手
2.umi.js约定式路由如何生成breadcrumbs
3.Umi3.0升级4.0实踩记录
4.react umi+dva开发基本流程（1）

UmiJS 学习笔记 1 - 快速上手

       UmiJS，由源中文读作乌米，由源是由源一个被称为“插件化的企业级前端应用框架”的工具。它的由源核心基于路由，支持配置式和约定式两种路由方式，由源旨在提供完整的由源锁机源码aide项目开发流程支持，涵盖从源代码开发到构建的由源各个环节，适用于各种类型的由源项目开发。UmiJS在阿里巴巴和网易等公司中得到了广泛应用，由源凭借其全面的由源功能和实战验证的可靠性，备受信赖。由源

       要快速上手Umi，由源有两种途径可供选择。由源首先，由源你可以手动创建项目文件，由源通过自定义文件结构来启动项目。网游免费源码另一种更为便捷的方式是利用Umi的脚手架工具，这能简化初始化过程。只需在浏览器中访问 http://localhost:，即可启动本地的Umi服务器，正式进入项目开发阶段。现在，你可以开始构建并探索你的项目了。

umi.js约定式路由如何生成breadcrumbs

       在使用UMI.js进行开发时，约定式路由成为首选，因其能带来清晰的目录结构体验。然而，在构建自动面包屑导航时，遇到了问题。官方文档虽提及路由管理，但并未明确指导如何初始化自动面包屑。红绿搭配源码

       在项目中，路由配置管理在内部自动建立，但获取配置信息却成了难题。由于路由信息并非直接配置，且网络搜索未提供明确解决方案，问题集中在如何获取这些配置信息。

       尝试直接引入`src/pages/.umi/router`文件，借助Webpack打包，但由于使用了TypeScript，此方法最终未能实现。接着，考虑手动编写解决方案，但这与约定式路由的理念相悖。

       经过探索，发现UMI使用路由插件提供了更新时的对到源码回调功能。借助这一特性，可以在订好的路径下将路由信息导出，从而解决了获取配置信息的难题。最终解决方案是在`.umirc.js`中调整`routes`配置，使得面包屑能实时获取路由信息。

       通过此方法，面包屑导航成功实现了自动更新，与约定式路由理念相融合，提高了用户体验。重要的是，通过利用UMI提供的功能，有效解决了初始化自动面包屑的挑战，实现了既定目标。

Umi3.0升级4.0实踩记录

       Umi构建工具升级到4.0版本的实操记录:

       升级原因：Umi 4.0提供了更简洁的React 支持，AntPro的cdh源码讲解文件结构虽复杂，但React版本不满足需求，因此选择Umi CLI进行项目升级。详情可参考快速入门指南。

       升级步骤：通过Umi CLI进行升级，它提供了AntPro模板，便于快速上手。

       升级后的变化：与Ant Pro 5.0相比，Umi 4.0模板使用了@umijs/max，移除了config文件夹，将其内容合并到根目录的config文件中，配置文件如路由和代理保持基本一致，但需要根据官方文档调整.umirc.ts和创建新的config文件。

       app.ts文件中的代码相比Ant Pro更为精简，且实现运行时配置，涉及的方法如onRouteChange、request和render等。国际化方面，需在.umirc.ts中添加locale，route名称改为title。

       自定义导航时，通过app.ts或layout方法，利用props中的menuData参数自定义头部导航。遇到pnpm error，可在package.json中加入特定配置，解决React版本依赖问题。

       Umi 4.0弃用了umi-request，改用axios，配置有微调。对于不支持的runtimePublicPath，可能需要自定义插件来处理。

       总结：升级过程中，虽然还有一些问题待解决，但总体体验良好。如果你也面临类似问题，这些经验或许能助你一臂之力。不过，具体情况仍需根据官方文档和项目需求来调整。

       最后，时间宝贵，祝大家晚安，如果有帮助，请记得点赞哦。

react umi+dva开发基本流程（1）

       认识UMI，一个企业级的React应用框架，官网地址：umijs.org/zh/guide/.它以路由为核心，支持类Next.js的约定式路由，以及各种进阶功能，如路由级别的按需加载。同时，UMI配备了完善的插件体系，覆盖从源码到构建产物的每个生命周期，支持各种功能扩展和业务需求，已拥有超过个插件。

       作为蚂蚁金服的底层前端框架，UMI已服务于超过个应用，包括Java、Node、H5无线、离线（Hybrid）应用、纯前端资产应用、CMS应用等。UMI旨在为内部及外部用户提供高效、稳定的前端解决方案。

       使用UMI搭建项目的步骤如下：

       1. 全局安装环境

       2. 构建项目并创建src目录

       3. 创建页面或路由组件

       4. 运行项目

       5. 构建生产环境

       这些步骤涵盖了基本的页面构建和项目启动。

       在UMI中，pages中的js组件并列，文件名即为路由路径。通过导航标签可实现路由切换。

       路由传参有三种形式：params、query、state。接收参数时，根据传参形式进行对应处理。

       嵌套路由时，构建_layout.js用于展示子组件。通过{ props.children}展示子组件。

       HTML模版定义包括定义title、meta等设置，构建document.ejs。全局公共的css编写，构建global.css，无需引入，所有pages组件均可用。