Launch webpack instead of metro during development

[rahulsmehta]

Describe the feature

After creating a fresh RN project (RN 0.65.1, TypeScript) & installing repack, running a build in Xcode will still start the Metro packager (instead of Webpack). I solved this by patching packager.sh in react-native/scripts to override the packager command (instead of react-native start, setting PACKAGER_CMD=webpack-start will launch webpack instead), and modifying the "Start Packager" build phase in Xcode as follows:

react-native patch: https://github.com/rahulsmehta/repack-example/blob/master/patches/react-native%2B0.65.1.patch

export RCT_METRO_PORT="${RCT_METRO_PORT:=8081}"
+ export PACKAGER_CMD="webpack-start"

echo "export RCT_METRO_PORT=${RCT_METRO_PORT}" > "${SRCROOT}/../node_modules/react-native/scripts/.packager.env"
if [ -z "${RCT_NO_LAUNCH_PACKAGER+xxx}" ] ; then
  if nc -w 5 -z localhost ${RCT_METRO_PORT} ; then
    if ! curl -s "http://localhost:${RCT_METRO_PORT}/status" | grep -q "packager-status:running" ; then
      echo "Port ${RCT_METRO_PORT} already in use, packager is either not running or not running correctly"
      exit 2
    fi
  else
    open "$SRCROOT/../node_modules/react-native/scripts/launchPackager.command" || echo "Can't start packager automatically"
  fi
fi

(note: this could also be due to error on my part while setting up my example project, so would love any feedback/feel free to close if that's the case)

Motivation

In the interest of making setup easier, it'd be possible to pull the modified versions of launchPackager.command/packager.sh into a scripts/ dir in repack & adding the overrides to the "Start Packager" build phase in the docs. Would there be any interest in accepting a PR for this enhancement?

[zamotany]

Yeah, if you could create a PR for that, I'm happy to merge it. My main concern is that we would have to maintain those scripts, but is should be rather straightforward to do.

[tom-sherman]

Another solution could be a note in the docs to recommend use of the --no-packager flag when running android/ios?

[RafikiTiki]

@rahulsmehta are you still willing to add a section in the docs regarding this configuration change? It will make make everyone's life easier at least until we have an automated way to generate a repack-configured app (like a rn-cli template). Evan after that happens it will be beneficial to have this section for all the people who are migrating brownfield apps from metro to repack.

[gronxb]

Is there any further support for this anymore ?

The metro runs when I do react-native run-ios, and the metro runs when I build from xcode.

Should I always develop with the following command only ? react-native run-ios --no-packager && react-native webpack-start

In my case, applying the patch did the same, and I got a message that the error: unknown command 'webpack-start'.

I want is a react-native that works perfectly with pnpm and monorepo.

[tom-sherman]

The metro runs when I do react-native run-ios, and the metro runs when I build from xcode.

You can remove the build phase to stop this from happening. Mine was called "Start Packager".

[gronxb]

@tom-sherman Thanks for the feedback! but I've checked the "Start Packager" and if I clear it, I won't be able to launch dev apps from xcode. The feature to launch dev apps from xcode is exactly what I need. I want the "Start Packager" to be webpack-start as normal.

[tom-sherman]

We run the react-native start-webpack command manually. You can always replace that build phase with one that runs start-webpack instead.

[github-actions[bot]]

This issue has been marked as stale because it has been inactive for 30 days. Please update this issue or it will be automatically closed in 14 days.

[github-actions[bot]]

This issue has been automatically closed because it has been inactive for more than 14 days. Please reopen if you want to add more context.

[jbroma]

reopening this as this is still relevant

[jbroma]

I see two ways we can move forward with this:

1. Considering we now have @callstack/repack-init it might be feasible to edit project configuration files for iOS and android and replace metro with equivalents from Re.Pack there.
2. Implementing #487 might resolve this issue on it's own, with no further changes in the configuration needed

[github-actions[bot]]

This issue has been marked as stale because it has been inactive for 30 days. Please update this issue or it will be automatically closed in 14 days.

[jbroma]

From Re.Pack 4.0 onwards, the start command is overridden so it should start Re.Pack dev-server instead of Metro.

Note that this only works for RN >=0.74 (RN-CLI >= 13).

Closed by #537