webstorm如何运行react

运行 React 项目的基本步骤

确保已安装 Node.js 和 npm/yarn。WebStorm 会自动检测这些工具。

在 WebStorm 中打开 React 项目文件夹。如果是新项目，可通过 Create New Project 选择 React 模板。

安装依赖

通过终端运行以下命令安装项目依赖：

npm install

或

yarn install

配置运行脚本

在 WebStorm 顶部菜单栏选择 Run > Edit Configurations。点击 + 添加新的 npm 配置。

在 Command 字段输入 start，确保 Package.json 路径正确。保存配置后，工具栏会显示该运行选项。

启动开发服务器

点击工具栏的运行按钮或使用快捷键 Shift+F10 启动开发服务器。默认情况下，React 项目会在 http://localhost:3000 自动打开浏览器。

调试 React 应用

在代码中设置断点，选择 Debug 模式运行项目。WebStorm 会连接到 React 的开发服务器，支持实时调试和热重载。

构建生产版本

通过终端运行构建命令：

npm run build

或

yarn build

构建后的文件会生成在 build 文件夹中，可用于生产环境部署。