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()
…