antd pro学习之react扫盲学习（一）

环境，脚手架准备

1. （一）环境
   （1）安装nodejs
   下载地址：https://nodejs.org/zh-cn/download/
   .msi–>需安装 .zip–>解压即用，无需安装
   （nodejs已集成了npm，无需另外安装）
   （2）编辑器 vscode
   下载地址：https://code.visualstudio.com/

2. （二）创建react项目
   在任意位置新建一个文件夹，shift+鼠标右键 ，选择shellpower选项，然后执行 如下命令，生成官方脚手架：

npm install -g create-react-app
create-react-app my-app(你的项目名称)
/*如果不成功，可以试试 create-react-app my-app(你的项目名称) --use-npm*/

当命令行出现 Happy hacking！时，说明手脚架已经生成成功了！
生成的项目结构如下：

node_modules  --  放置项目依赖的第三方的包

public  --  favico.ico: 网页tab标签小图标
            index.html: 初始页面
            manifest.json: wepack打包优化相关

scr  --  放的项目所有的源代码
    所有代码的入口在 index.js 里面--->即为之后我们开发主要会编辑的文件
 
yarn.lock  --  项目依赖的安装包
 
package.json  --  node的包文件、项目的结束（名字/版本号/依赖的第三方的包/调用的指令等）
    记录用npm安装过哪些包  ^  代表 npm install 的时候会自动安装大版本号相同的最新的
    一个版本（x.y.z）
        x - 大版本号，api兼容变化会改变大版本号，x 递增
        y - 次版本号，新增功能时但不影响api的兼容，y 递增
        z - 修订号，bug修复不影响api兼容，z
 
package-lock.json  --  确定当前安装的包的依赖，以便后续在安装的时候生成相同的依赖（锁定
                       安装时的包的版本号）
    5.x.x之后的npm版本中，pakage-lock.json是会被自动生成的
        version记录了包的版本，resolved记录了包的下载来源。
        package.json 和 package-lock.json的关系：
            package.json负责的不仅仅是记录各种依赖包，它还记录了其他信息。
            pakage-lock.json的作用仅仅是辅助package.json锁定依赖包的版本
            pakage-lock.json可有可无，没有的话只是不能锁定版本而已，而package.json
            是必须要有的。
 
.gitignore  --  git管理代码的时候，有的文件不希望传到git仓库中，可以把文件定义在这。
 
App.test.js  --  自动化测试的文件

在vscode编辑器中引入刚刚创建的项目

在vscode终端执行 npm start，启动项目：

npm start

默认浏览器会自动打开网页http://localhost:3000/

则说明启动成功了