react项目如何打开预览

运行开发服务器

在项目根目录下执行以下命令启动开发服务器：

npm start

或使用yarn：

yarn start

默认情况下，开发服务器会启动在 http://localhost:3000，浏览器将自动打开该地址。

配置环境变量

如需修改默认端口，可在项目根目录创建或修改 .env 文件，添加：

PORT=自定义端口号

保存后重新运行 npm start 即可生效。

生产环境预览

构建生产版本后，可使用静态服务器预览：

npm run build
npx serve -s build

此命令会生成优化后的代码，并通过 serve 启动一个本地服务器，默认端口通常为 5000。

使用HTTPS

某些情况下需启用HTTPS预览。修改 package.json 中的 start 脚本：

"start": "set HTTPS=true&&react-scripts start"

重新运行 npm start 即可通过 https://localhost:3000 访问。

局域网内访问

若需其他设备访问开发环境，启动时添加主机参数：

HOST=0.0.0.0 npm start

确保设备在同一网络，通过本机IP加端口即可访问。