创建React项目
创建一个React项目非常简单,通常有几种方法可以进行,下面是最常见的几种方法:
1. 使用 create-react-app (已经不被推荐了)

create-react-app 是一个官方的脚手架工具,用于快速创建 React 项目。它会为你配置好很多常用的开发工具和预设。
步骤:
-
安装 Node.js 和 npm(如果你还没有安装的话):
React 需要 Node.js 和 npm,安装方式请参考 Node.js 官方网站,安装完毕后可以在终端运行node -v和npm -v来检查是否安装成功。 -
使用
create-react-app创建项目: 打开终端或命令提示符,执行以下命令:npx create-react-app my-app这会创建一个名为
my-app的 React 项目。npx是一个工具,可以自动下载并运行create-react-app,无需全局安装。 -
进入项目文件夹:
cd my-app -
启动开发服务器:
npm start此时,浏览器会自动打开
http://localhost:3000,你就可以看到一个默认的 React 应用。
2. 使用 Vite(现代化快速开发工具)
Vite 是一个现代化的构建工具,启动速度快,适合用来开发 React 应用。
步骤:
-
安装 Vite: 首先,确保你已经安装了 Node.js,然后在终端中运行:
npm create vite@latest my-vite-app --template react -
进入项目文件夹:
cd my-vite-app -
安装依赖:
npm install -
启动开发服务器:
npm run dev访问
http://localhost:5173,就能看到你的 React 项目了。
如果用WebStorm创建的话,可以按照如下所示操作:

进入后点击运行npm install,然后可以运行这个按钮"dev" : “vite”

点击进入下面这个链接

能看到下面这个界面就算成功了

3. 使用 Next.js(适用于需要服务端渲染或静态生成的项目)
如果你需要构建一个支持服务端渲染(SSR)或静态站点生成(SSG)的 React 应用,可以使用 Next.js。

步骤:
-
创建 Next.js 项目:
npx create-next-app@latest my-next-app -
进入项目文件夹:
cd my-next-app -
启动开发服务器:
npm run dev访问
http://localhost:3000,你就能看到 Next.js 默认页面。

总结
create-react-app:最基础的 React 脚手架,适合大多数 React 应用。Vite:速度快,适合开发时追求快速反馈的场景。Next.js:适用于服务端渲染或静态生成的 React 应用,SEO 更友好。
你可以根据项目需求选择合适的工具来创建 React 项目!
