antd umi搭建react环境

这里写自定义目录标题

1.安装node.js环境
1.1.安装
傻瓜式下一步:

下载完成后双击下载好的可执行文件开始安装,点击next进入下一步,勾选同意协议,继续下一步。然后选择安装的位置,默认是在C盘,改成D盘安装,这是个好习惯,建议保持。然后进入模块配置步骤。

antd umi搭建react环境

安装完成之后,测试安装是否成功,运行CMD,分别输入node -v 和 npm -v 分别查看node和npm的版本号

antd umi搭建react环境

1.2.配置npm在安装全局模块时的路径和缓存cache的路径
在node.js安装目录下新建两个文件夹 node_global和node_cache,在node_global文件夹下创建node_modules文件夹
运行命令设置新地址
npm config set profix “D:\node.js\node_global”
npm config set cache “D:\node.js\node_cache”

antd umi搭建react环境
1.3.配置环境变量
环境变量” -> “系统变量”:新建一个变量名为 “NODE_PATH”,如下图

antd umi搭建react环境

环境变量” -> “用户变量”:编辑用户变量里的Path,将相应npm的路径(“C:\Users\用户名\AppData\Roaming\npm”)改为:“D:\nodejs\node_global”,如下:

antd umi搭建react环境

1.4.测试
在cmd命令下安装全局webpack

npm install webpack -g
2.安装yarn
接下来,开始安装yarn,其中tyarn使用的是npm.taobao.org的源,速度要快一些 ,可以把tyarn看做了优化了的yarn

npm npm i yarn tyarn -g #-g 是指全局安装 tyarn -v #进行测试,如果能够正常输出版本信息则说明安装成功了

测试是否安装成功

antd umi搭建react环境

注意:这里如果安装完马上输入tyarn,可能会提示系统找不到,这时候需要配置变量,网上很多教程,这里就不详细写出了

3.安装umi
tyarn global add umi #安装
umi #进行测试
查看是否成功

antd umi搭建react环境

注意:安装完马上运行可能会出现umi找不到或者目录不正确,这里需要配置环境变量和修改umi.cmd文件

先查看umi.cmd的位置

tyarn global bin

antd umi搭建react环境
然后修改此文件成下面这样即可

antd umi搭建react环境
原文链接:https://blog.****.net/qq_38763540/article/details/104781828