React脚手架的使用

脚手架的安装/项目创建

脚手架的全局安装

1、电脑中需要有nodejs程序
2、在桌面中输入win+R 输入cmd

弹出这个页面

在此处输入 npm i -g create-react-app 进行脚手架安装
安装完成之后 然后我们创建项目
在程序中输入 create-react-app 项目名称(项目名称需要英文并且有意义)
项目创建完成的状态

会自用跳转到此页面

脚手架的配置及应用

react脚手架中 我们一般在src文件中进行编写
src文件中我们一般可以存放 普通组件和路由组件
public文件相当于公共文件
在public里边有一个html文件 相当于vue中html页面 单页面应用

注意：
1、组件文件名及组件中的js文件命名的首字母大写
每一个组件都有自己的css样式 所以在创建组件文件时候 我们会直接创建一个文件夹 里边既存放js文件又需要存放css文件

依赖的安装与配置

比如在项目中安装bootstrap依赖
步骤：
1、首先使用npm安装bootstrap npm i bootstrap@3 -save-dev（开发环境安装）
2、在index.js文件中使用import引入css文件
improt '../node_modules/bootstrap/dist/css/bootstrap.min.css';
3、在需要使用bootstrap组件的地方直接引入使用就可以了

安装axios
在react中引入axios有两种形式：
1、局部引入
1 安装axios npm i axios --save-dev
2 在需要请求数据的组件中使用 axios.get() axios.post() …
2、全局引入

1 安装axios npm i axios --save-dev
2 在index.js文件中使用import 引入axios
再次使用React.Component.prototype.axios=axios
3 在需要请求的组件中使用this.axios.get() this.axios.post() …