当前位置:首页 > React

react 如何运行

2026-02-11 12:55:42React

运行 React 项目的步骤

安装 Node.js
确保系统已安装 Node.js(建议使用 LTS 版本),可通过官网下载并安装。安装完成后,验证版本:

node -v
npm -v

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

npx create-react-app my-app

或通过全局安装后创建:

npm install -g create-react-app
create-react-app my-app

启动开发服务器
进入项目目录并运行开发模式:

cd my-app
npm start

默认情况下,开发服务器会在 http://localhost:3000 启动,并自动打开浏览器。

构建生产版本
生成优化后的代码用于部署:

npm run build

构建后的文件位于 build 目录中,可直接部署到静态文件服务器。

其他常用命令

运行测试
执行 Jest 测试套件:

npm test

检查代码格式
使用 ESLint 进行代码检查:

npm run lint

自定义配置
如需修改配置(如 Webpack),可通过 eject 暴露配置(不可逆):

react 如何运行

npm run eject

标签: react
分享给朋友:

相关文章

react 如何跳转

react 如何跳转

使用 React Router 进行页面跳转 React 应用中通常使用 react-router-dom 库实现页面跳转。以下是几种常见的跳转方式: 安装依赖 npm install react…

react如何清理

react如何清理

清理 React 项目的方法 清理未使用的依赖项 运行 npm prune 或 yarn install --production 可以移除 node_modules 中未在 package.json…

react如何检测窗口

react如何检测窗口

监听窗口大小变化 使用useEffect钩子和resize事件监听窗口尺寸变化。在组件挂载时添加事件监听器,卸载时移除监听器以避免内存泄漏。 import { useState, useEffect…

vscode如何开发react

vscode如何开发react

使用 VSCode 开发 React 的配置指南 安装必要工具 确保 Node.js 和 npm/yarn 已安装,可以通过终端输入 node -v 和 npm -v 检查版本。若未安装,需从官网下载…

react如何上传图片

react如何上传图片

使用input标签上传图片 在React中可以通过HTML的<input type="file">元素实现图片上传功能。创建一个受控组件来管理文件选择状态: function Image…

如何安装antd react

如何安装antd react

安装 Ant Design (antd) 到 React 项目 确保已创建 React 项目,若未创建可通过以下命令初始化: npx create-react-app my-app cd my-ap…