webstorm 无法直接配置 expo 运行配置,因其依赖 expo start 而非 react-native run-ios/android;需用 npm 类型配置,设 command 为 start、working directory 为项目根目录,并手动启动 expo go 或执行 npx expo run:ios/android。

WebStorm 里不能直接配置 Expo 运行配置
Expo 项目不依赖 react-native run-ios 或 run-android,WebStorm 内置的 “React Native” 运行配置类型对 Expo 完全无效。你强行添加并运行,只会报错 Cannot find module 'react-native' 或卡在 Metro 启动阶段——因为 Expo 用的是 expo start,不是 RN CLI。
正确做法是用 npm 或 script 类型配置:
- 点击右上角 ▼ → Edit Configurations…
- 点 + → 选
npm -
Package.json:选项目根目录下的package.json -
Command:填start(对应"scripts": { "start": "expo start" }) -
Working directory:必须设为项目根目录(含App.js和package.json的那一层)
启动 Expo Go 预览必须手动扫码或命令行触发
WebStorm 执行 npm start 只会启动 Metro 服务并打印二维码,它不会自动唤起手机上的 Expo Go、也不会拉起 iOS 模拟器。这是 Expo 的设计逻辑,不是 WebStorm 缺陷。
常见操作路径:
- 终端里执行
npx expo start -c(-c强制清除缓存,避免旧 bundle 干扰) - 手机装好
Expo Go(iOS App Store / Android Google Play),打开后自动连接同一局域网的开发机 - 或者终端执行
npx expo run:android或npx expo run:ios—— 这两个命令才真正调用原生构建流程,需要 Android Studio/Xcode 环境支持 - WebStorm 中无法替代
run:android的设备启动环节;模拟器/真机仍需手动准备
调试 JS 时断点不生效?缺 JetBrains IDE Support 插件
Expo 默认走 Chrome 远程调试通道,和原生 RN 一样。WebStorm 要映射源码断点,必须靠 Chrome 插件协同。没装或版本不匹配,断点永远灰色。
确认步骤:
- Chrome 访问
chrome://extensions,确保已安装官方JetBrains IDE Support(作者 JetBrains s.r.o.) - 插件状态为「启用」,且兼容当前 WebStorm 版本(2023.3+ 推荐用 v2024.x 最新版)
- 启动 Expo 后,在手机 Expo Go 里摇一摇 → 开启
Debug→ 此时 Chrome 访问chrome://inspect/#devices应显示IDE connected - WebStorm 中设置 Run Configuration 的
Browser字段留空或填Chrome即可,不决定通道,只影响自动打开行为
Expo 项目里别碰 android/ 和 ios/ 目录
除非你明确切换到了 bare workflow,否则 android/ 和 ios/ 目录根本不存在。WebStorm 里若看到红标报错 “Cannot resolve symbol ‘xxx’”,大概率是你误用了 react-native 的代码补全库(如 react-native-definitelytyped),而 Expo SDK 的类型定义在 expo 包里。
正确配置提示:
- 删掉 WebStorm 设置中所有手动添加的
react-native外部库 - 确保
node_modules/expo已被 WebStorm 自动识别为 JavaScript library(File → Project Structure → Libraries) - 写
import { useCameraPermissions } from 'expo-camera';时,如果没提示,先运行npx expo install expo-camera,再重启 WebStorm 索引 - 裸工作流(bare)项目才需要 Xcode/Android Studio 环境;托管工作流(managed)下,
expo run:ios仍需 Xcode,但无需手动配Podfile或build.gradle











