react全家桶搭建本地环境

本文详细介绍如何使用create-react-app搭建React项目基础架构,包括安装react-router、redux、react-axios等核心库,以及如何配置UI框架Ant-design和项目依赖。同时,文章还介绍了项目文件结构及如何在React项目中配置webpack和babel。

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

安装react基础架构:

  1. px create-react-app my-app
  2. cd my-app
  3. npm start

安装react-router:

  1. npm install   react-router-dom --save

安装redux:

  1. npm install --save redux

同时安装其附加包:

  1. npm install --save react-redux
  2. npm install --save-dev redux-devtools

安装react-axios:

  1. npm install react-axios

安装依赖:

  1. npm install prop-types

UI框架:

Ant-design

 

项目文件结构:

注意⚠️:

  1. 通过create-react-app脚手架搭建的react项目默认是没有webpack.config.js文件的,通过执行npm run eject可以生成config,script两个文件,此过程是不可逆转过程
  2. vue脚手架搭建的项目默认是可以使用@,react需要手动自己配置,在webpack.config.js里的alias属性加'@': resolve('src'): alias: {'@': path.resolve('src')}
  3. 项目没有.babelrc文件,antd按需加载需要在babelrc里添加配置。我直接使用在package.json文件的babel下添加antd的配置,这样就可以使用该UI框架

 

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值