使用集成的工具链，以实现最佳的用户和开发人员体验。它们有助于完成如下任务：
- 扩展文件和组件的规模
- 使用来自npm的第三方库
- 尽早发现常见错误
- 在开发中实时编辑CSS和JS
- 优化生产输出
工具链
React 团队主要推荐这些解决方案：
- 如果你是在学习 React 或创建一个新的单页应用，请使用 Create React App。
- 如果你是在用 Node.js 构建服务端渲染的网站，试试 Next.js。
- 如果你是在构建面向内容的静态网站，试试 Gatsby。
- 如果你是在打造组件库或将 React 集成到现有代码仓库，尝试更灵活的工具链。
Create React App
是一个用于学习 React 的舒适环境，也是用 React 创建新的单页应用的最佳方式。
它会配置你的开发环境，以便使你能够使用最新的 JavaScript 特性，提供良好的开发体验，并为生产环境优化你的应用程序。你需要在你的机器上安装 Node >= 8.10 和 npm >= 5.6。要创建项目，请执行：
npx create-react-app 项目名
cd 项目名
npm start
Create React App不会处理后端逻辑或操纵数据库，他只是创建一个前端构建流水线，可以使用它来配合任何你想使用的后端。它在内部使用Babel和webpack。
当你准备好部署到生产环境时，执行npm run build会在build文件夹内生成你应用的优化版本。
Next.js
Next.js是一个流行的、轻量级的框架，用于配合React打造静态化和服务端渲染应用。它包括开箱即用的样式和路由方案，并假定你使用Node.js作为服务器环境。
Gatsby
Gatsby是用React创建静态网站的最佳方式。它让你能使用React组件，但输出预渲染的HTML和CSS以保证最快的加载速度。
更灵活的工具链
以下工具链为 React 提供更多更具灵活性的方案。推荐给更有经验的使用者：
Neutrino 把 webpack 的强大功能和简单预设结合在一起。并且包括了 React 应用和 React 组件的预设。
Parcel 是一个快速的、零配置的网页应用打包器，并且可以搭配 React 一起工作。
Razzle 是一个无需配置的服务端渲染框架，但它提供了比 Next.js 更多的灵活性。
从头开始打造工具链
一组JavaScript构建工具链通常有这些组成：
- 一个package管理器，比如Yarn或npm。
它能让你充分利用庞大的第三方 package 的生态系统，并且轻松地安装或更新它们。
- 一个打包器，比如webpack或Parcel
它能让你编写模块化代码，并将它们组合在一起成为小的 package，以优化加载时间。
- 一个编译器，比如Babel
它能让你编写的新版本 JavaScript 代码，在旧版浏览器中依然能够工作。
