react项目创建 及 初始化操作

本文详细介绍了如何使用Create React App创建React项目,包括项目启动、运行、打包部署及配置文件的提取过程。提供了从项目创建到配置的一站式指南。

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

1. 创建 react 项目

create-react-app 项目名

  • 在你的某个文件夹里面创建
  • 遇到各种警告可以忽略,只要不是红色的
    在这里插入图片描述

2. 运行你的项目

yarn start 或者 npm start

  • 会自动打开项目对应的网页
  • 如果你使用的是 yarn 去安装依赖,那么你在后期的运行等都用 yarn
  • 反之 npm 相同,不要混着用
    在这里插入图片描述
    在这里插入图片描述

3. 打包

yarn bulid   或者   npm run build

打包前
在这里插入图片描述
打包后
在这里插入图片描述

4. 把配置文件解出来

  • 解出来的目的是为了做配置

  • 比如你想配置 端口文件,你只能进入到 node_models 里面进行配置,这样太麻烦了,显然不是我想要的

  • 这时你就需要把它整出来配置

yarn eject   或者    npm run eject
  • 在你解出来的时候会有一个警告,他会告诉你这个过程是不可逆的
    在这里插入图片描述
  • 在这个过程中可能会出现错误
    在这里插入图片描述
翻译结果:
----------------------------------------------------------------------------
这个git仓库有未跟踪的文件或未提交的更改:
.idea /
删除未跟踪的文件,保存或提交任何更改,trThis git存储库中有未跟踪的文件或未提交的更改:
.idea /
删除未跟踪的文件、隐藏或提交任何更改,然后重试
-----------------------------------------------------------------------------

处理方法:

  • 按照该顺序执行 git 程序
  1. git add .
  2. git commit -m ‘init’

再次执行 yarn eject 就不会出问题了

解完后的结果

  • 会发现多出来一个 configscript 的目录
    在这里插入图片描述
    在这里插入图片描述
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值