React 学习笔记（15）：react 脚手架

1，脚手架的作用

在前面的学习中，我们都是直接在 html 中引入 react 依赖包进行开发，这种方式很简单，上手也快，但是这种项目非常的简陋，开发效率低，很多目前前端生态中能够大幅提高开发效率的工具都没有用到。

完善的项目应该有 webpack、devServer、eslint、jsx 编译 等等工具的支持，一个工程化的项目能够大幅度提高开发效率和开发体验。

但是，如果让我们自己手动搭建一个完善的项目，成本会非常高，需要学习很多前置知识，而且搭建出来的项目还可能有很多问题。

因此，React 官方为我们提供一个脚手架工具，通过这个脚手架工具我们只需要几行简单的命令就能生成一个已经配置好的、完善的工程化项目，非常的简单快捷。

2，react 脚手架的使用

• 首先确保已经安装了 node.js
• npm install -g create-react-app，全局安装 react 脚手架
• 切换到想创建项目的目录
• create-react-app hello-react，创建 hello-react 项目
• 进入项目文件夹，cd hello-react
• 启动项目：npm run start

3，在脚手架项目中开发组件

在之前的学习中，写组件都是直接在 html 中写，现在到了脚手架项目阶段，来看看在脚手架项目中应该如何定义和使用组件。