API - Compilation Lifecycle

[wheresrhys]

i.e which compilation stages/events happen in which order, what they do by default, what properties are available within the handler, what they can be used to do, what they should/shouldn't be used to do, and how they relate to other bits of the lifecycle.

Flow diagrams (which really aid understanding of complex flows, and are sorely lacking in webpack 1 docs) would be a great addition too

PS. Excellent to hear that webpack 2 documentation is being given such careful thought

[TheLarkInn]

Yes I think this would be a great companion to the API - Plugins section, maybe a secondary companion to the complete API hooks.

@bebraw thoughts?

[bebraw]

Go for it. Great addition to plugin docs.

[SpaceK33z]

@TheLarkInn, just an idea, perhaps we could use the scheme that you used for readthesource here?

[TheLarkInn]

@sebastiandeutsch Can you make a web friendly png or jpeg of the UMD you created for me the other day?

[sebastiandeutsch]

@TheLarkInn yes sure. What's the width that you need?

[sebastiandeutsch]

@TheLarkInn here you go: http://imgur.com/a/JQIxm

[skipjack]

Related: #469 -- Maybe someone can take a stab at recreating that chart in mermaid? Also based on @bebraw's comment in #487 I think we need to make sure that image is still accurate for webpack 3.

[skipjack]

Just in case anyone comes across this -- @hulkish has expressed interest in tackling this one... I believe he'll be sharing some thoughts soon.

[hulkish]

@skipjack yes, I'm currently putting together a small script that will produce this in a way that's easily updatable.

[skipjack]

Ok dug into this a little bit since it seems to have gone inactive again...

which compilation stages/events happen in which order, what they do by default, what properties are available within the handler, what they can be used to do, what they should/shouldn't be used to do, and how they relate to other bits of the lifecycle.

I'm not sure when it was added but this section seems to do exactly what you describe. The events are listed in order (as far as I can tell) with a description, callback parameters, and some details on how they relate to the other events. Maybe we can just flesh it out a little, or even break it out into a separate Lifecycle page with more detailed sections on each event?

I added a note to #469 re the flow chart. @hulkish did you ever get any farther with that script?

[skipjack]

Ok I'm going to close this out as it's become fairly inactive but I'll keep in mind the idea I mentioned about refactoring that table into a separate "Lifecycle" page as we continue to clean up the API section. If someone has time and would like to flesh it out, please drop a comment here and feel free to submit a PR.

[astik]

Trying to learn about how webpack internally works, i found on https://github.com/fanjunzhi/lifecycle-webpack-plugin this diagram : https://img.alicdn.com/tps/TB1GVGFNXXXXXaTapXXXXXXXXXX-4436-4244.jpg.
It would be great to have an updated version into documentation (and also in english =P).
A separate "Lifecycle" page would be great in order to fully understand what is happening, especially for plugin maker.