react - 项目启动和项目结构

react环境搭建

1.安装安装nodejs( 问度娘 )。

2.安装npm或者yarn或cnpm( 问度娘 )。

3.安装react脚手架create-react-app：

1. npm install -g create-react-app

2. 或  cnpm install -g create-react-app

3. 或  yarn add -g create-react-app

react创建项目

1. create-react-app  myReact   

2. cd myReact   

3. npm start  或 yarn start

react項目结构

初始项目结构如下：


┌── public // 公共资源文件

│ ├── favicon.ico // 是浏览器tab上图标，也是这个项目的一个标志，也可以说是代表一个公司的标志。可以替换。

│ ├── index.html // 主文件

│ └── manifest.json // 编译配置文件

│

├── node_modules // 项目依赖包文件夹

├── src // 我们的项目的源码编写文件（里面的文件可根据喜好，随意更改）

│ ├── App.css // 样式文件（删除）

│ ├── App.js // 入口组件，其他组件会被插入此组件中，此组件通过index.js再插入 index.html 文件里，形成单页面应用；

│ ├── App.test.js // 测试文件（删除）

│ ├── index.css // 样式文件（删除）

│ ├── index.js // 存放的是这个项目的核心内容，也就是我们的主要工作区域。其中，index.js文件是和index.html进行关联的文件的唯一接口，类似vue里面的main.js。

│ ├── serviceWorker.js //

├── package-lock.json // npm5 新增文件，优化性能

├── package.json // 项目依赖包配置文件（node配置文件）

└── README.md // 项目说明文档

react项目准备

下载相关插件

npm insatll classnames --save    // 样式类名插件