UmiJS搭建企业级React项目实战操作(码字ing)

前言

UmiJs就相当Vue中的Vue-Cli脚手架一样。用来搭建企业级的React项目。

下面就跟我来一起学习，怎么用UmiJS搭建一个企业级的React项目。学会了好找工作，好加薪。

一、准备工作

1、检验node版本

建议node版本为8.10或更高。在控制台输入node -v 检验

2、安装yarn

建议使用yarn来管理npm依赖包。在控制台输入npm install -g yarn安装。

安装完成后，输入yarn -v，检验是否安装成功

3、安装UmiJS

全局安装UmiJS，并确保它是2.0.0或更高版本。在控制台输入yarn global add umi

因为安装地很慢，我们可以安装tyarn，使用国内资源来安装UmiJS。 在控制台输入npm i yarn tyarn -g，安装tyarn。

在控制台输入输入tyarn -v检验是否安装成功

然后在控制台输入tyarn global add umi

安装完成后，输入umi -v，检验是否安装成功

如果提示“umi”找不到命令，你需要将tyarn global bin路径配置到环境变量中。先在控制台输入tyarn global bin

配置完成后，再控制台输入输入umi -v，检验是否安装成功

二、创建 umi 项目

1、创建目录，打开目录

在控制层输入mkdir 05umi ， cd 05umi

2、tyarn create umi

在控制台输入tyarn create umi

3、选择 project

通过上下键来选择，选择 app - Create project with a simple boilerplate, support typescript. 回车继续。

4、是否使用typescript

输入N，回车继续。

5、选要安装的功能

通过上下键来选择，空格确认，选择anta、dva后，回车继续。

6、创建好目录和文件

7、安装依赖

在控制台输入tyarn

8、运行

在控制台输入yarn start

运行完成后

在浏览器中打开http://localhost:8000/,会出现如下画面，代表已经创建成功