react如何创建项目

使用 Create React App 创建项目

安装 Create React App（CRA）工具后，运行以下命令创建新项目：

npx create-react-app my-app

my-app 为项目名称，可根据需求修改。

等待依赖安装完成后，进入项目目录并启动开发服务器：

cd my-app
npm start

默认情况下，开发服务器会在 http://localhost:3000 启动。

使用 Vite 创建 React 项目

Vite 是一种更快速的构建工具，适合现代前端开发。运行以下命令创建项目：

npm create vite@latest my-react-app --template react

选择框架时需指定 react，随后进入项目目录并安装依赖：

cd my-react-app
npm install
npm run dev

Vite 开发服务器默认运行在 http://localhost:5173。

使用 Next.js 创建 React 项目

Next.js 是支持服务端渲染的 React 框架。通过以下命令初始化项目：

npx create-next-app@latest

按照提示选择配置选项（如 TypeScript、ESLint 等），完成后启动开发服务器：

npm run dev

默认访问地址为 http://localhost:3000。

手动配置 React 项目

如需更灵活的配置，可手动初始化项目：

1. 创建项目目录并初始化 package.json：

   mkdir my-react-project
   cd my-react-project
   npm init -y

2. 安装 React 和 React DOM：

   npm install react react-dom

3. 配置 Babel 和 Webpack（需额外安装相关依赖）。

项目结构说明

典型 React 项目结构包含以下核心文件：

• src/index.js 或 src/main.jsx：应用入口文件。
• src/App.js 或 src/App.jsx：根组件。
• public/index.html：HTML 模板。

工具链（如 CRA 或 Vite）会自动生成这些文件，手动配置需自行创建。