(初学者速成React必备)React运行配置环境的详细配置

配置前准备

node.js 安装

要下载node.js，我们要首先打开node.js的官网（Node.js — Run JavaScript Everywhere）

然后点击Download Node.JS(LTS)进行最新版本的node.js的下载和安装；

安装完成后，我们打开终端输入node -v 和 npm -v,如果能正常显示版本号则表明安装成功

(我的版本是以前下载的，并不是最新node版本，但是可以兼容使用)

正式配置

配置npm下载源

由于某些原因，默认的下载源下载包的时候非常缓慢，我们可以配置一个新的下载源进行后续的下载，首先我们打开终端，输入命令npm install -g nrm （如图）

接着我们输入nrm use taobao 来添加淘宝的镜像（这里我已经添加过了，可能和大家显示有所不同）：

我们可以输入nrm ls 查看目前的下载源，这里我们可以看到'taobao'的下载源：

到目前为止，我们的npm下载源已经配置完毕

React安装

我们打开终端，进行对React的全局安装，输入以下命令：

npm install -g create-react-app

注意：这里有的朋友可能会遇到这样的提示： 无法加载文件C:***\AppData\Roaming\npm\create-react-app.ps1，因为在此系统上禁止运行脚本。

此时，我们要以管理员方式打开一个新的终端，输入 set-ExecutionPolicy RemoteSigned 再选择A选项，最后 get-ExecutionPolicy即可解决上述问题,然后重新进行上述操作。

等待安装完成后输入create-react-app -V（V大写），出现如图所示提示则安装完成：

创建React项目

我们在桌面上新建一个文件夹，在新建文件夹内右键打开终端，

然后输入 create-react-app myapp 命令，等待终端加载完成，项目创建成功则如图所示：

我们通过Visual Studio Code软件打开新建的文件夹，会发现里面有这些文件：

然后我们在Visual Studio Code目录下打开终端，输入：npm start 启动我们刚才创建的项目

结果如图所示：

1.在Visual Studio Code终端上：

2.在浏览器上：

这就证明了我们已经搭建好了react项目的运行环境，接下来只要在创建文件的src主文件进行修改和添加代码就可以了