当前位置:首页 > React

react 如何启动

2026-02-11 13:53:23React

启动 React 项目的步骤

确保已安装 Node.js
React 依赖 Node.js 环境,需安装最新稳定版本(建议 16.x 或更高)。可通过以下命令检查版本:

node -v
npm -v

创建新的 React 项目
使用官方工具 create-react-app 快速初始化项目:

npx create-react-app my-app

其中 my-app 为项目名称,可自定义。

进入项目目录
创建完成后,切换到项目文件夹:

cd my-app

启动开发服务器
运行以下命令启动本地开发环境:

npm start

默认会在浏览器打开 http://localhost:3000,并支持热更新。

其他启动方式

使用 Yarn
若偏好 Yarn,安装后运行:

yarn create react-app my-app
cd my-app
yarn start

已有项目启动
对于现有项目,安装依赖后启动:

npm install
npm start

注意事项

  • 首次启动可能较慢,需下载依赖包。
  • 确保网络畅通,部分依赖需从境外源下载。
  • 若端口冲突,可通过修改 package.json 中的 start 脚本更换端口,例如:
    "start": "set PORT=3001 && react-scripts start"

react 如何启动

标签: react
分享给朋友:

相关文章

react native 如何

react native 如何

React Native 开发基础 React Native 是一个用于构建跨平台移动应用的框架,允许开发者使用 JavaScript 和 React 编写代码,同时生成原生 iOS 和 Androi…

react中monent如何获取日期

react中monent如何获取日期

使用 Moment.js 获取当前日期 在 React 中通过 Moment.js 获取当前日期,可以直接调用 moment() 函数。它会返回包含当前日期和时间的 Moment 对象。 impo…

react如何销毁

react如何销毁

React 组件销毁的机制 在 React 中,组件的销毁通常由 React 的生命周期管理。当组件从 DOM 中移除时,React 会自动触发销毁相关的生命周期方法。以下是关键点: 组件的销毁通常…

react如何读

react如何读

React 的发音 React 的发音为 /riˈækt/(音标),读作“瑞-艾克特”。其中: “Re” 发音类似英文单词 “read” 的开头部分。 “act” 发音与英文单词 “act” 一致。…

react如何浮动

react如何浮动

使用 CSS 实现浮动 在 React 中实现浮动效果可以通过 CSS 的 float 属性完成。在组件的样式文件或内联样式中直接设置 float: left 或 float: right。…

如何配置react

如何配置react

配置React项目的步骤 安装Node.js和npm 确保系统已安装Node.js(包含npm)。可通过官网下载并安装最新版本。安装完成后,运行以下命令验证版本: node -v npm -v 创…