关于前端:UmiJS-3X实战从头开始一

最近参加开发的一个后盾我的项目，前端开发框架采纳了 reactJS。因为之前始终是用 vue，尽管之前也有学习过 react 的一些常识，但仅仅是入门根底内容，并没有搭建过大型利用。这次正好利用这个机会，打算从头开始搭建一套基于 react 的前端框架。

通过技术调研和探讨，最终 ui 框架确定应用 AntDesign，所以前端底层框架就抉择了 UmiJS。Umi 整合了阿里的 Dva,AntDesign，能够说是阿里前端工具的全家福了。

Umi 3.x 版本的官网介绍是： 插件化的企业级前端利用框架 。官网列出了 6 个个性，其中对开发人员来说，感兴趣的次要有 3 个：

• 可扩大

Umi 实现了残缺的生命周期，并使其插件化，Umi 外部性能也全由插件实现。此外还反对插件和插件集，以满足性能和垂直域的分层需要。

• 开箱即用

Umi 内置了路由、构建、部署、测试等，仅需一个依赖即可上手开发。并且还提供针对 React 的集成插件集，外延丰盛的性能，可满足日常 80% 的开发需要。

• 齐备路由

同时反对配置式路由和约定式路由，同时放弃性能的齐备性，比方动静路由、嵌套路由、权限路由等等。

上面就来说一下 Umi 3.X 的装置过程：

1. 如果你还没有装置 yarn 和 tyarn，倡议先装置它们。yarn 装置依赖包比 nmp 的可靠性更高，具体参考两者的区别。tyarn 是 yarn 的国内镜像，以下装置过程都是应用的 tyarn。
2. 应用脚手架命令装置（二选一）：

// 默认装置无提醒
tyarn create @umijs/umi-ap

或者

// 能够抉择不同装置选项，有提醒
tyarn create umi

如果装置遇到问题，能够尝试先全局装置 umi 和 create-umi，个别状况就没有问题了：

tyarn global add umi
tyarn global add create-umi

失常装置后，持续装置依赖：

tyarn install

而后输出启动命令：

yarn start

不出意外的话，你能够在浏览器看到以下页面：

这就意味着咱们的第一个以 umi 为底层框架的前端 react+antDesign 我的项目启动胜利了。