从0开始搭建react项目

第一次真正意义上接触 react 项目,做好了一步一步慢慢踩坑填坑的准备,本文就主要介绍如何完整的实现一个react项目。

注:可能会因为公司安排其他任务,所以有可能会花很长一段时间完善这篇文章。

第一步:搭建

1、全局安装 create-react-app

      npm install create-react-app

2、创建项目,安装初始依赖

      create-react-app projectName(文件夹名)

3、安装完成,进入项目文件夹并启动

      cd projectName && npm run start

4、自定义启动端口

      找到 package.json 文件,将 scripts 下面的 start 修改成 set PORT=1234 && react-scripts start

5、安装 antd 组件

      npm install antd

6、安装 axios

      npm install axios

7、安装 react 的路由 react-router-dom

      npm install react-router-dom --save-dev

8、安装 react-redux

      npm i react-redux

至此,这个项目已经算是搭建完成了,必要的路由,发送请求的 axios ,状态管理 react-redux,自定义启动端口都有了。

二、项目结构目录

找到 src 文件夹,在其下面建以下几个文件夹(可以自己命名):

api:接口文件目录                     components:相关组件文件目录          router:路由文件目录

static:静态资源文件目录          store:react-redux 状态管理文件目录            utils:各工具类文件目录

views:页面视图层文件

 

 

  • 0
    点赞
  • 3
    收藏
    觉得还不错? 一键收藏
  • 1
    评论
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值