Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

BrowserSync + Express? #154

Closed
kevinSuttle opened this issue May 8, 2014 · 20 comments
Closed

BrowserSync + Express? #154

kevinSuttle opened this issue May 8, 2014 · 20 comments

Comments

@kevinSuttle
Copy link

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
Copy link
Contributor

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

@kevinSuttle
Copy link
Author

@shakyShane
Copy link
Contributor

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
Copy link
Contributor

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

@shakyShane
Copy link
Contributor

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

@kevinSuttle
Copy link
Author

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
Copy link
Contributor

Did you try the second example I posted?

@kevinSuttle
Copy link
Author

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

@shakyShane
Copy link
Contributor

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

@kevinSuttle
Copy link
Author

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
Copy link
Author

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
Copy link
Author

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

@kevinSuttle
Copy link
Author

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
Copy link
Contributor

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
Copy link
Author

@shakyShane
Copy link
Contributor

which version of BrowserSync is that ?

@kevinSuttle
Copy link
Author

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.

mrajcok added a commit to mrajcok/gulp-recipes that referenced this issue Dec 6, 2014
instead of BrowserSync's 'files' option.
This seems to be the recommended practice, see
http://www.browsersync.io/docs/gulp/ and
BrowserSync/browser-sync#154
And it also seems to notice the changes much faster.

Added main.js so people can see how changing a JavaScript file also results
in the browser getting automtically reloaded.
@daslicht
Copy link

daslicht commented Mar 6, 2016

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

@damienromito
Copy link

@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
Copy link

daslicht commented Jun 1, 2016

Thank you !

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

4 participants