search

microsoft / react-native-windows

A framework for building native Windows apps with React.
https://microsoft.github.io/react-native-windows/
Other
16.27k stars 1.14k forks source link

Unable to change Metro port from default of 8081 #6833

Open ajax-sandell-peterman opened 3 years ago

ajax-sandell-peterman commented 3 years ago

When using React Native Desktop for Windows I'm unable to use run-windows to start my app. I get an error in the UI about being unable to load the bundle:

Error 80072f78 downloading http://localhost:8081/index.bundle?platform=windows&dev=true&hot=false&inlineSourceMap=true

and the following error in the console:

error listen EADDRINUSE: address already in use :::8081. Run CLI with --verbose flag for more details.

Environment

>npx react-native --version
4.13.1

>npx react-native info
error Unrecognized command "info".
info Run "react-native --help" to see a list of all available commands.

Steps To Reproduce

  1. Create a new project with port 8081 being used by another application
  2. Attempt to run it using npx react-native run-windows

Expected Results

For the app to load without a bundle loading error and console error about port 8081 already being in use.

Based upon this source file (lines 380 and 406) it would seem as though run-windows hardcodes the port that Metro runs on. This should ideally be configurable as I have another (legacy) app running on my machine that requires the use of this port and it's not changeable. Is there an environment variable or other way that I'm not aware of that would permit reconfiguration of run-windows to use a different port? Vanilla React Native allows you to pass the --port argument to change this. Thanks very much for any assistance you might be able to provide!

andrew-woodburn09 commented 3 years ago

Running into the same exact issue to where I cannot get past this as well and I have tried everything possible to get past it. McAfee is blocking 8081 at within our organization and would be extremely useful if we could override this port setting.

asklar commented 3 years ago

As a workaround you can start Metro separately via yarn start --port ... and then start the app with npx react-native run-windows --no-packager. Note that in order to use a non-default port, the app must know to connect to it so you'll have to set the ReactInstanceSettings.SourceBundlePort

chrisglein commented 3 years ago

We can fix the half where it is passed through. But then the app code will still need to make a private modification. In the meantime the workaround exists.

Using this bug to track fixing that pass through (also make sure to check with iOS/Android for parity of how they handle this passthrough)

NickGerleman commented 3 years ago

Upstream CLI does accept port https://github.com/react-native-community/cli/blob/master/docs/commands.md#run-ios

jonthysell commented 1 year ago

This is easy enough to work around by changing the port in the dev menu and when starting metro, but sure, the CLI could help with it too.

shubhanshu02 commented 11 months ago

@jonthysell Is this issue still open to work?