doc: more clear statement about code splitting #963
Conversation
Codecov Report
@@ Coverage Diff @@
## master #963 +/- ##
==========================================
- Coverage 88.42% 88.33% -0.09%
==========================================
Files 30 30
Lines 674 686 +12
Branches 156 163 +7
==========================================
+ Hits 596 606 +10
- Misses 64 66 +2
Partials 14 14
Continue to review full report at Codecov.
|
theKashey
force-pushed
the
impove-async-loader-readme
branch
from
a8a05aa
to
ac53309
Compare
|
|
||
| // Hello.js | ||
| import { hot } from 'react-hot-loader' | ||
| const Hello = () => 'Hello' | ||
| export default hot(module)(Hello) // <-- the only change to do | ||
| export default hot(module)(Hello) // <-- module will reload itself |
There was a problem hiding this comment.
You should use loadable-components or react-imported-component. They provide the best support for RHL.
There was a problem hiding this comment.
They are in a section about "friendly" loaders, and dont require any workaround example, as long just works.
We could swap sections, displaying an easy path first.
| @@ -203,25 +203,36 @@ Using React Hot Loader with React Native can cause unexpected issues (see #824) | |||
|
|
|||
| ### Code Splitting | |||
|
|
|||
| Most of modern React component-loader libraries ([loadable-components](https://github.com/smooth-code/loadable-components/), | |||
| [react-loadable](https://github.com/thejameskyle/react-loadable)...) are compatible with React Hot Loader. | |||
| Most of modern React component-loader libraries are not "100%" compatible with React-Hot-Loader, as long | |||
There was a problem hiding this comment.
We should discourage using react-loadable.
|
I made some test on Loadable Components. I don't know what has changed but I no longer need to reload everything. It works out of the box without adding any code. Could be the same for React Loadable. |
|
You know, it sounds like a bug. Ok a huge change inside webpack. |
|
Example from this PR. Let's make it clear before rewriting this README section. |
|
@neoziro - so everything is due to autoload inside the constructor. Look like the condition should be a bit different, - preload only NOT for browser, to emulate As result - the state of code splitting is unchanged. You still have somehow trigger reimport, and it will not work without it. |
|
@theKashey the behaviour that I want is loading in component but only server-side https://github.com/smooth-code/loadable-components/blob/master/src/loadable.js#L58. So I think doing it in constructor makes it compatible with HMR, so nice! Yes the state of Code Splitting stay unchanged. Loadable Components and Imported Components work both out of the box. |
|
But |
Related to #947
A bit more clear statement about code splitting..