如何配置react环境

安装 Node.js 和 npm

确保系统中已安装 Node.js 和 npm（Node.js 通常自带 npm）。可以通过以下命令检查是否安装成功：

node -v
npm -v

若未安装，从 Node.js 官网 下载并安装 LTS 版本。

使用 Create React App 初始化项目

Create React App (CRA) 是官方推荐的 React 项目脚手架工具。通过以下命令创建新项目：

npx create-react-app my-app

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

进入项目目录并启动开发服务器

项目创建完成后，进入项目目录并启动开发服务器：

cd my-app
npm start

开发服务器默认运行在 http://localhost:3000，浏览器会自动打开该页面。

安装必要的依赖

根据项目需求安装额外依赖，例如路由管理库 react-router-dom：

npm install react-router-dom

配置代码编辑器

推荐使用 Visual Studio Code (VS Code) 作为开发编辑器，并安装以下插件以提高开发效率：

• ESLint：代码质量检查
• Prettier：代码格式化
• Reactjs code snippets：React 代码片段

项目结构说明

典型的 React 项目结构如下：

my-app/
├── node_modules/       # 依赖库
├── public/             # 静态资源
├── src/                # 源代码
│   ├── App.js          # 主组件
│   ├── index.js        # 入口文件
│   └── ...
├── package.json        # 项目配置
└── README.md           # 项目说明

生产环境构建

完成开发后，运行以下命令生成优化后的生产版本：

npm run build

构建结果会保存在 build 目录中，可直接部署到服务器。