脚手架去搭建项目会使得项目结构层次更清晰，也更加方便使用者去开发。
1、全局安装脚手架
// 全局安装后，在任意目录下都能运行create-react-app命令初始化项目
yarn global add create-react-app2、安装完成后检查脚手架版本
create-react-app -V当提示create-react-app -V不是内部命令时，是由于未配置环境变量导致的。
3、查看全局安装位置目录
npm root -g
image.png
4、查看全局安装位置目录
yarn global dir
image.png
5、开始配置环境变量
进入上述的全局安装的位置目录地址，然后返回两次，看到bin目录，点击进入bin目录文件，当看到有create-react-app时，拷贝当前的位置目录。
点开 电脑 -> 高级配置选项 -> 环境变量 -> path -> 新建 -> C:\Users\15590\AppData\Local\Yarn\bin将位置地址放进去
找到bin目录.png
找到create-react-app.png
新建环境变量.png
环境变量新建好了之后，就 重新打开cmd命令，使用 create-react-app -V的命令查看版本，有版本号了，那么就可以使用命令创建react项目了。
版本号.png
6、初始化项目
使用命令初始化项目
create-react-app demo
7、react项目的目录结构
- node_modules
包含整个项目所需要用到的依赖（依赖包、模块、或是插件等） - public
项目访问目录
其中的index.html是项目访问的入口 - src
项目的源码目录
index.js是项目程序的入口
App.js是整个项目的根组件 - package.json
包文件（记录着项目的所有信息，包含了安装了哪些依赖以及一些运行或者打包项目的命令等） - README.md
项目信息的记录，展示出去的项目信息内容 - yarn.lock
锁文件（记录着项目的依赖以及下载地址，后面几次的下载速度会更加快）
8、react项目运行
使用项目的运行命令 ：yarn start
执行成功.png
© 著作权归作者所有,转载或内容合作请联系作者
平台声明：文章内容（如有图片或视频亦包括在内）由作者上传并发布，文章内容仅代表作者本人观点，简书系信息发布平台，仅提供信息存储服务
喜欢的朋友记得点赞、收藏、关注哦！！！