UmiJs初探(一)

709 阅读1分钟

小知识,大挑战!本文正在参与“  程序员必备小知识  ”创作活动

最近在学习react,必然要尝试下大名鼎鼎的 Ant Design。 经过一番探索,发现Umijs这个底层前端框架。

Umi是什么

Umi,中文可发音为乌米,是可扩展的企业级前端应用框架。Umi 以路由为基础的,同时支持配置式路由和约定式路由,保证路由的功能完备,并以此进行功能扩展。然后配以生命周期完善的插件体系,覆盖从源码到构建产物的每个生命周期,支持各种功能扩展和业务需求。

这是umi官网,对其的介绍。 那么先来探索一下,首先是安装

安装 Umi

首先要有node 环境,并且要求10.13 或以上。

官网推荐使用 yarn 管理 npm 依赖

1. 安装yarn

npm install -g yarn

2.安装Umi

mkdir umidemo //创建文件夹umidemo
cd umidemo    //进入umidemo
yarn create @umijs/umi-app  

create 是个命令,可以帮助你一次完成两件事情: create-<starter-kit-package>全局安装,或者如果软件包已存在,则将软件包更新为最新版本

3.安装的依赖

这里使用yarn来安装依赖

yarn

yarn install v1.21.1
[1/4] 🔍  Resolving packages...
success Already up-to-date.
✨  Done in 0.71s.

4.运行

yarn start

Starting the development server...

✔ Webpack
  Compiled successfully in 17.84s

 DONE  Compiled successfully in 17842ms                                       8:06:31 PM

  App running at:
  - Local:   http://localhost:8000 (copied to clipboard)
  - Network: http://192.168.12.34:8000

5.安装完成

至此安装完成,访问 http://localhost:8000 看到

QQ截图20211022152300.jpg

表示成功运行