React全家桶+共享单车实战开发—— 2-2 React脚手架、Yarn介绍

本文详细介绍了如何使用React脚手架快速创建项目，并深入探讨了Yarn作为新一代包管理工具的优势及使用方法。从安装React脚手架到项目初始化，再到Yarn的高效管理，为开发者提供了全面的指导。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

问题：

如何安装React脚手架
如何使用架手架初始化项目
什么是Yarn，为什么要使用Yarn
如何使用Yarn

一、如何安装和使用React脚手架

npm install -g create-react-app
create-react-app my-app

cd my-app
npm start

二、什么是Yarn

Yarn是新一代包管理工具

三、为什么使用Yarn

安装速度快、版本统一，更安全、更好的语义化

四、如何使用Yarn

yarn init 初始化项目
yarn add 安装包
yarn remove 删除包
yarn/yarn install 安装依赖

五、创建项目

创建脚手架

npm install -g create-react-app
create-react-app my-app

2. 命令行进行项目目录 cd my-app

cd my-app

3. 安装 react-router ,

 yarn add react-router

此时，package.json显示

弱项卸载此安装包，使用命令： yarn remove react-router

在package.json文件中，下面的scripts实际上是我们的命令行，启动我们的项目，构建项目，单元测试、eject则是用于暴露配置。注意的是，此文件没有webpack的配置信息，这是因为脚手架把webpack的配置封装起来了。我们只需关注src目录下的源码部分，什么都不需要关注，这就是脚手架的魅力，它帮助我们初始化项目，我们只需要关注核心的部分。但是，有人会问如果想修改webpack配置怎么办？方法就是通过eject，利用eject暴露配置信息。

 "scripts": {
    "start": "react-scripts start",
    "build": "react-scripts build",
    "test": "react-scripts test",
    "eject": "react-scripts eject"
  },