React开发环境配置
前言
我们学习任何开发的第一步当然是要配置开发环境。我们打开React开发文档时可以看到如下两个方式：
这里不建议采用第一种方式，因为第一种方式是启动一个线上的编辑器。作为“专业”的开发者，我们当然不会在每次开发时都打开这么一个窗口。我们更希望的是搭建一个本地的开发环境。
当我继续向下学如何搭建本地环境时，却悲惨地发现，官网并没有提供面向我这种小白的配置环境教程。通过不断地查资料看视频，这里给出目前最新的本地开发环境的配置方法：
本地开发环境配置
Node.js安装
安装Node.js的目的是要安装其内置的npm包管理工具，便于下载我们在React开发（或是其他开发）中用到的各类包。
我们打开Node.js的官网：
为确保开发环境的稳定性，我们选择长期维护版本。这里直接按照默认方式安装就可以了。安装完成后打开终端，分别输入node -v 和 npm -v,如果能正常显示版本号则表明安装成功。如不能正常显示版本号则首先排查环境变量是否配置成功。以下为配置成功后命令行显示的结果：
配置npm下载源
由于某些原因，我们使用默认的源下载包的时候会异常缓慢，甚至出现连接失败从而导致下载失败的情况。所以为了便于我们在国内也能正常使用npm，我们需要配置国内的下载源。而就我的经验而言，各大论坛上对于源的说法众说纷纭。所以为了更方便地管理npm下载源，我们需要一个下载源管理工具——nrm！
我们打开一个新的终端，输入以下命令：
npm install -g nrm
这里不展示安装成功的效果了（因为我已经安装好了嘿嘿嘿）。
输入nrm use taobao来添加淘宝的镜像：
我们输入 nrm ls查看目前的下载源。这里可以看到我们已经添加了淘宝下载源：
到此为止我们安装React的前序步骤已经全部完成了，接下来就开始正式开始安装React了。
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项目
这里我们通过创建一个项目来测试是否React安装成功。
我们在电脑里创建一个文件夹（这里我是在桌面上创建了一个名为code的文件夹），在文件夹内右键打开终端（或是在命令行内通过cd命令切换到我们创建的目录），然后输入 create-react-app myapp，稍等片刻，等待出现如下提示项目就创建成功了：
这里我们打开我们创建的目录下生成了一个myapp的文件夹，可以看到里面有这些文件：
我们来分析一下这些文件:
- node_modules：React的依赖文件
- public：React项目的资源文件
- src：源代码
- package.json：粗略的配置文件
- package-lock.json：详细的配置文件
- readme.md：使用说明
然后我们在目录下打开的终端输入： npm start，启动我们刚才创建的项目，即可看到下面的终端的提示，并会自动启动一个默认页面。至此，我们的React开发环境就搭建完成了。
Tips：在VSCode中打开我们新建的文件夹，然后启动VSCode中的终端输入上述命令是与上述操作等效的
补充的一些内容：
项目的迁移
当我们需要将自己的代码分享给他人时，要确保他人已部署好node.js，然后将自己项目内除node_modules文件夹以外的文件复制过去，然后在其目录下打开命令行，输入 npm i，即按照package.json的配置文件安装组件，保证对方的开发环境中用的组件与自己的开发组件是完全一致的。
全局安装与单次安装的区别
全局安装是安装一次后再创建项目是不会下载最新版本的React，而是沿用之前下载的版本，优点是再次创建项目时等待时间较短，缺点是创建时不能保证使用的是最新的组件；
单次安装的命令为： npx create-react-app myapp，优点是创建时保证使用的是最新的组件，而缺点就是每次创建项目时都需要下载组件。
小结
React安装与以往直接下载个js文件然后导入是不同的，相对而言较为复杂。但这是开发React的第一步，所以一定要掌握配置环境的方法！
环境的配置就先讲到这里，大家在配置环境的过程中再遇到什么问题可以与我交流探讨，今天就拜拜啦xdm，咱们下回再见！
我正在参与掘金技术社区创作者签约计划招募活动，点击链接报名投稿。
