当前位置:首页 > React

如何启动react

2026-03-30 16:32:30React

安装Node.js和npm

确保系统已安装Node.js(包含npm)。可通过官网下载并安装最新版本。安装完成后,在终端运行以下命令验证:

node -v
npm -v

创建React项目

使用官方工具create-react-app快速搭建项目。运行以下命令(需替换my-app为项目名称):

npx create-react-app my-app

进入项目目录

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

cd my-app

启动开发服务器

运行以下命令启动本地开发环境,默认在浏览器打开http://localhost:3000

npm start

项目结构说明

  • src/:存放核心代码(组件、样式等)。
  • public/:包含静态文件(如index.html)。
  • package.json:记录依赖和脚本命令。

可选操作

如需生成生产环境代码,运行:

npm run build

测试项目可通过:

如何启动react

npm test

标签: react
分享给朋友:

相关文章

react 如何启动

react 如何启动

创建 React 项目 使用官方工具 create-react-app 快速初始化项目,需提前安装 Node.js(版本 ≥ 14.0.0)和 npm/yarn: npx create-react-…

react如何刷新

react如何刷新

刷新React组件的方法 使用状态更新触发重新渲染 通过更新组件的状态可以触发重新渲染。React会在状态变化时自动重新渲染组件。 const [count, setCount] = useStat…

如何恢复react

如何恢复react

恢复 React 项目的方法 检查并修复依赖项 运行 npm install 或 yarn install 重新安装所有依赖项。如果依赖项损坏或缺失,这将恢复项目所需的库和工具。 恢复删除的文件 如…

react如何引入

react如何引入

引入React的方法 React可以通过多种方式引入项目,具体取决于项目需求和开发环境。以下是常见的几种方法: 通过CDN引入 在HTML文件中直接通过CDN链接引入React和ReactDOM:…

odyssey react 如何

odyssey react 如何

Odyssey React 是耐克推出的一款跑鞋系列,以其轻量化设计和React泡沫缓震技术著称。以下是关于该系列鞋款的主要特点和使用建议: 核心特点 React泡沫中底提供出色的能量回馈和缓震效果…

react如何减少setState

react如何减少setState

减少 React 中 setState 调用的方法 合并多次状态更新 使用函数式更新方式合并多次 setState 调用。React 会将多次状态更新批量处理,避免不必要的重新渲染。 // 非函…