Browser-sync: BrowserSync + Express?

[kevinSuttle]

Wondering about how to use the proxy config of BrowserSync with the routing architecture of Express. I feel like I've seen an example you've posted somewhere, but I can't find it. In my defense, I'm really bad at computers.

[shakyShane]

Depends how you're using BrowserSync - gulp, grunt, command-line?

[kevinSuttle]

Gulp. https://gist.github.com/kevinSuttle/c8b198aaa30349088c35

[shakyShane]

BrowserSync has built in support for streams, so where possible you not use the built-in file watching, but use the reload method instead.

update to the latest browsersync and then use this. (change the proxy bit to match your express server.

https://gist.github.com/anonymous/efe1e3ab581aa7a25e51

[shakyShane]

Actually, that might not work because you're using nodemon (browser sync expects express to be running already)

[shakyShane]

This might be better - https://gist.github.com/anonymous/4e0da1c62c48b736993a

[kevinSuttle]

Well I'm using Nodemon because it's the only way I know to reload the server when there are changes. It's relatively disposable, and both it and Express are fairly new to me. Feel free to enlighten me! :)

[shakyShane]

Did you try the second example I posted?

[kevinSuttle]

Yes. I commented on your gist and update mine. TL;DR: No dice. :/

[shakyShane]

Hmmm, this one works well for me: https://gist.github.com/anonymous/e99dfca5d7ec7e48f804

[kevinSuttle]

Same results for me as before. :/

What other info can I provide? Is there an Express + BrowserSync example somewhere I can reference? Again, Nodemon is optional.

[kevinSuttle]

Also, for some reason your gists are appearing as "anonymous" usernames. Makes it hard to keep track of revisions. Just a head's up. :)

[kevinSuttle]

Hm. http://127.0.0.1:8080/ also returns Cannot GET '/'

[kevinSuttle]

I don't think 8080 is a viable port since I'm behind a firewall. I can get 3000 to work by following this: http://code.tutsplus.com/tutorials/introduction-to-express--net-33367 (albeit, sans-BrowserSync).

[shakyShane]

This isn't a problem with BrowserSync. You first need to get express running correctly (so that you can access it in a browser) - and then whatever URL that ends up being, plug it into the proxy option of the BrowserSync config

[kevinSuttle]

Got it working. https://gist.github.com/kevinSuttle/c8b198aaa30349088c35

[shakyShane]

which version of BrowserSync is that ?

[kevinSuttle]

0.9.1 - latest. It all works really nicely with Sass source maps and Chrome Dev Tools Workspaces also. :) I need to screencast or write up how I did this. Others could benefit.

[daslicht]

How about using BrowserSync + Express and just using npm to run commands and not something like Gulp?

[damienromito]

@daslicht you can set the param --proxy of browser-sync start and specidy the express server
http://stackoverflow.com/questions/37548537/express-and-browsersync-without-gulp

Here a demo : https://github.com/damienromito/express-sync

[daslicht]

Thank you !