react如何启动6

创建 React 项目（基于 Vite）

使用 Vite 初始化 React 项目（推荐现代项目使用）：

npm create vite@latest my-react-app --template react
cd my-react-app
npm install
npm run dev

传统方式创建 React 项目

通过 Create React App (CRA) 创建项目（传统方式）：

npx create-react-app my-react-app
cd my-react-app
npm start

项目目录结构说明

核心目录和文件：

• src/App.js：主组件文件
• src/index.js：应用入口文件
• public/index.html：HTML 模板
• package.json：依赖和脚本配置

配置调整

修改启动端口（在 package.json 中）：

"scripts": {
  "start": "set PORT=3006 && react-scripts start"
}

生产环境构建

生成优化后的生产版本：

npm run build

启动开发服务器

运行开发模式（默认端口 3000）：

npm start

使用 TypeScript 模板

创建 TypeScript 版本的 React 项目：

npx create-react-app my-app --template typescript

环境变量配置

创建 .env 文件添加自定义变量：

REACT_APP_API_URL=https://api.example.com