How to run Browsersync on non-default port

sage
1

Working with Sage 9 for the first time. I use a cloud based development server + IDE (e.g. I can’t access http://localhost/)

The platform only gives me access to ports 8080 - 8082. I would greatly appreciate suggestions on how to get browsersync to run on these ports.

2

https://browsersync.io/docs/options#option-port

OR: https://github.com/roots/sage/blob/master/assets/config.json#L17 <- change the port (and url if needed) there

3

Thanks @JulienMelissas - I had already attempted to change the proxyUrl and port. My config.json L#16-17 is:

“devUrl”: “https://allcleared-rfair404.c9users.io”,
“proxyUrl”: “https://allcleared-rfair404.c9users.io:8080”,

However, when I $ run yarn run start it shows: Local: https://localhost:8080

perhaps the proxyUrl isn’t working as expected? Or I am missing something still.

4

Because you’re trying to run the Cloud9 IDE it’s maybe trying to start a proxy locally? I really don’t know as you’re not doing local development. Maybe the other guys can weigh in.

5

I’d need this feature too in order to work of two versions on the same site in parallel.

The --port flag is not “transferred” from yarn to browsersync. For example:

$ yarn run start --port 3002
yarn run v0.21.3
$ webpack --hide-modules --watch --config assets/build/webpack.config.js 

Webpack is watching the files…


events.js:160
      throw er; // Unhandled 'error' event
      ^

Error: listen EADDRINUSE :::3000

Found this PR that allows to use a different proxied URL from the CLI: https://github.com/roots/sage/pull/1849. Might help to find a solution to this problem?

With Sage 8, when starting a new server, it automatically chose a new port if default ones are already being used: localhost:3000 --> localhost:3002 --> … Any idea how to get this behavior back? Any Webpack expert around? :slight_smile: EDIT: seems to work only if launching multiple servers in the same folder…

6

did you not try this?

7

Sorry, didn’t receive a notification for your answer. Of course I can manually change the port, but with Sage 8, I could just launch it and BrowserSync would detect the port conflict and select another. I’m actually dealing with multiple websites each day and it was easier this way.

8

Hi everyone - did any of you make any more progress with this?

I’m also trying to get Browsersync to run on Cloud9, but haven’t had any luck.
I’m currently running Sage 8.5.2
I’ve set my devUrl in manifest.json to the Cloud9 preview address, and I’ve tried changing the port option in browserSync.init() in gulpfile.js to port 8080, but I still can’t get the Cloud9 preview to update.

Any help is much appreciated - I’m not sure what to try next.

9

I’m trying the same thing in Cloud9 too & looking for an answer.

10

Hi there anyone have any luck with the port issue? I’m getting these errors

events.js:173
throw er; // Unhandled ‘error’ event
^
Error: listen EADDRINUSE: address already in use :::3030
at Server.setupListenHandle [as _listen2] (net.js:1256:14)
at listenInCluster (net.js:1304:12)
at Server.listen (net.js:1392:7)

11

You can update proxyUrl to use a different port. You could also try killing whatever is already on port 3000:

yarn global add fkill-cli
fkill :3000
12

Hi Ben thanks so much! This works great! Appreciate all your work on this and the constant support. Super awesome! Cheers.

1 Like