什么是create-react-app

什么是create-react-app

Create React App是FaceBook的React团队官方出的一个构建React单页面应用的脚手架工具。它本身集成了Webpack，并配置了一系列内置的loader和默认的npm的脚本，可以很轻松的实现零配置就可以快速开发React的应用。

下面介绍一下create-react-app的安装及使用。（推荐教程：Node.js教程）

全局安装

首先确保你电脑上安装最新的

# 全局安装
npm install -g create-react-app
# 构建一个my-app的项目
npx create-react-app my-app
cd my-app
# 启动编译当前的React项目，并自动打开 http://localhost:3000/
npm start

以上命令执行完成后，则自动打开： http://localhost:3000/

如果你不能确保最新版本，可以先尝试卸载： npm uninstall -g create-react-app,然后再全局安装。

构建React项目的其他方式

npm
# npm init <initializer> is available in npm 6+
npm init react-app my-app
Yarn
# yarn create is available in Yarn 0.25+
yarn create react-app my-app

项目目录

项目的默认目录：

├── package.json
├── public                  # 这个是webpack的配置的静态目录
│   ├── favicon.ico
│   ├── index.html          # 默认是单页面应用，这个是最终的html的基础模板
│   └── manifest.json
├── src
│   ├── App.css             # App根组件的css
│   ├── App.js              # App组件代码
│   ├── App.test.js
│   ├── index.css           # 启动文件样式
│   ├── index.js            # 启动的文件（开始执行的入口）！！！！
│   ├── logo.svg
│   └── serviceWorker.js
└── yarn.lock

默认的npm的脚本

启动开发