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

Add webpack proxy, react-dev-tools hot client #312

Closed
wants to merge 7 commits into from

Conversation

jariz
Copy link
Collaborator

@jariz jariz commented Jul 18, 2017

😍

screen shot 2017-07-18 at 09 40 38

This fixes #284.
But, this is mostly a POC: it sacrifices a lot, sadly.

Notes:

  • I was unable to get this working with webpack-hot-middleware & webpack-dev-middleware. It appears react-dev-utils/webpackHotDevClient uses a couple of hardcoded features only available in webpack-dev-server (which is kind of hacky!)
    Sadly, this means we still need to run webpack on a seperate port; my goal was to completely eliminate the need of a separate webpack server, but this makes this pretty much impossible.
  • This breaks backwards compatibility; it assumes all razzle apps are using the proxy; otherwise the client will be unable to connect.
  • This does require all razzle based apps to have razzle-dev-utils as a dependency. We could make the webpackProxy part of razzle itself, but it really feels a lot more like a dev util to me.
  • It doesn't appear to catch run time errors like create-react-app.
    Haven't been able to figure out why yet.

@jariz
Copy link
Collaborator Author

jariz commented Jul 18, 2017

There's also the possibility to builld our own error overlay, but that would bring the extra burden of maintaining that one as well, while other really great solutions like react-error-overlay & react-dev-utils/webpackHotDevClient exist.

…eware

# Conflicts:
#	examples/basic/package.json
#	examples/with-custom-babel-config/package.json
#	examples/with-custom-webpack-config/package.json
#	examples/with-inferno/package.json
#	examples/with-jest-snapshots/package.json
#	examples/with-preact/package.json
#	examples/with-rax/package.json
#	examples/with-reason-react/package.json
#	examples/with-redux/package.json
#	packages/razzle-dev-utils/package.json
@jaredpalmer
Copy link
Owner

jaredpalmer commented Jul 18, 2017

This is pretty amazing work. So thank you x1000000.

Backwards compat is pretty important. Not because I personally care too much, but because Razzle's competition (CRA, Next, react-server, etc.) are really good about maintaining it. Thus, I would explore writing our writing our own overlay based on some of the work you have done, but as a separate package (perhaps called razzle-dev-tools). This would be optional, as Razzle is not a runtime dependency right now.

FYI, if we could figure out how to make Razzle work as simply node.js middleware (like next), I would totally be open to runtime a dep.

@jariz
Copy link
Collaborator Author

jariz commented Jul 18, 2017

Yea, I'd be interested in exploring that too. What's really great about next's error handling is that it also shows server side runtime/compile errors, something we probably can never do if we use CRA's error handling, would be really cool if we could add that to razzle as well.

Regarding middleware: I basically had the entire client side compiling working as a middleware, shouldn't be too hard to add server compiling to that as well.
Let's make a separate issue for that though.

@jariz
Copy link
Collaborator Author

jariz commented Jul 21, 2017

Going to close this in favor of a from scratch based approach.

@jariz jariz closed this Jul 21, 2017
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

Successfully merging this pull request may close these issues.

Add error overlay like create-react-app's
2 participants