내가 바보같이 iOS, macOS를 베타버전으로 업그레이드 하는 바람에 여러 문제로 RN 프로젝트가 디바이스에서 실행이 안되는 이슈 발생

Xcode에서 프로젝트의 xcworkproject 파일을 실행하면 디바이스에서 실행이 된다.

하지만 Hot Reload가 되지 않는 문제가 있었는데, 여러 설정을 변경해 Hot Reload가 가능하게 설정하였다.

🔵 React Native 디버거 설정

VSCode에서 React Native Tools 확장을 설치한다.

VSCode의 명령 팔레트(Shift + Cmd + P) 에서 "React Native: Start Packager"를 실행하여 Metro 번들러를 시작한다.

🔵 디버그 설정 파일 추가

프로젝트 루트에 .vscode/launch.json 파일을 생성하고 다음 내용을 추가한다.

{
  "version": "0.2.0",
  "configurations": [
    {
      "name": "Debug iOS",
      "program": "NULL/.vscode/launchReactNative.js",
      "type": "reactnative",
      "request": "launch",
      "platform": "ios",
      "target": "device",
      "internalDebuggerPort": 9090
    }
  ]
}

🔵 launchReactNative.js 파일 생성

.vscode 디렉토리에 luanchReactNative.js 파일을 생성하고 다음 내용을 추가한다.

const path = require("path");
const { runCli } = require("react-native-community/cli");
const workspaceRoot = path.resolve(__dirname, "..");
const projectRoot = workspaceRoot;
runCli([workspaceRoot, "start", "--projectRoot", projectRoot]);

🔵 디바이스에서 Reload 실행

반드시 디바이스와 맥이 동일한 네트워크를 공유해야 합니다.

이제 Hot Reload 가능!