1.第一步 安装脚手架

 开打使用windows键加R打开运行输入cmd

 在里面输入 npm install -g create-react-app 

 注意:安装前请确保电脑中安装过node.js 

2.第二步 切换到想创项目的目录，使用命令：create-react-app appName   

appName是应用的名字,可以自己随意定义

我创建了一个名字叫做react_test的项目,然后等待安装

安装完成会出现以下内容

 Success!表示安装成功

3.第三步 进入项目文件夹 在文件夹内打开

按住shift键加鼠标的右键

 点击在此处打开Powershell窗口(命令窗口)

 4.第四步 启动项目:输入命令 npm start

 然后等待,就会发现自动开打浏览器,并出现以下页面,此时项目就运行起来了

1.首先下载好创建的react项目后，在cmd命令框中先进到对应的项目路径

2. 命令行输入node -v，npm -v命令，查看对应的版本，如下图

3. 输入npm install命令 来安装依赖（需要段时间才成执行完成）

如果你是下载react项目，通常不会包含node_modules文件夹，需要在执行启动命令前，先执行npm install来安装依赖。

这个时候，它会自动根据你package.json里面的依赖，下载你需要的node_modules，然后就能运行了。

4.输入 npm start 命令 启动项目即可

5. 访问地址

为http://localhost:3000/ua-ipps-audit

ua-ipps-audit为项目名，3000为默认端口

6.项目创建及介绍

Create React App 是一个用于学习 React 的舒适环境，也是用 React 创建新的单页应用的最佳方式。

它会配置你的开发环境，以便使你能够使用最新的 JavaScript 特性，提供良好的开发体验，并为生产环境优化你的应用程序。你需要在你的机器上安装 Node >= 14.0.0 和 npm >= 5.6。安装如下图，只需安装这一个，会同时安装好npm

要创建项目，请执行如下命令，其中my-app为起的对应的项目名称：

npx create-react-app my-app

cd my-app

npm start

Create React App 不会处理后端逻辑或操纵数据库；它只是创建一个前端构建流水线（build pipeline），所以你可以使用它来配合任何你想使用的后端。它在内部使用 Babel 和 webpack，但你无需了解它们的任何细节。

当你准备好部署到生产环境时，执行 npm run build 会在 build 文件夹内生成你应用的优化版本。你能从它的 README 和用户指南了解 Create React App 的更多信息。

目录

1.前言

2.一条启动命令执行多条命令语句

3.隆重推出工具：Conacurrently

4.隆重推出工具：wait-on

4.隆重推出工具：cross-env

1.前言

使用过vue或者react的开发者，应该都会知道，在项目中有个package.json文件，里面有项目的启动命令，这些命令我们可以自定义，甚至，有些项目需要启动多条命令，下面将会介绍如何自定义命令和如何更加方便的配置开发环境。

2.一条启动命令执行多条命令语句

关键符号&表示和的意思

然而，这种命令有很多缺点：

1.不能跨平台，windowes不好用

2.命令没有先后之分，容易出问题

3.输出没有逻辑性，看起来很乱

4.占用端口

3.隆重推出工具：Conacurrently

Conacurrently同时同步的意思

--save-dev表示只在开发时用

npm install -g concurrently --save-dev

修改后的命令如下：

注意：斜杠\代表转义的意思

 缺点：

比如说运行两条命令，结果有一条慢一些，就会出问题，比如白屏现象。

4.隆重推出工具：wait-on

npm install wait-on  --save-dev

修改后的命令如下 

4.隆重推出工具：cross-env

作用：解决跨平台设置环境变量的问题

npm install --save-dev cross-env

比如下面这个，意思是我打开项目的时候，不要默认给我打开浏览器