Webpack documentation omnishambles. Need improvement.

For me one of the most difficult parts was getting the ordering of the various loaders right and understanding what each loader does exactly. I'm still not sure what the css-loader does specifically compared to the style-loader and what css-loader/locals does differently, I just understand which one I need to use in each configuration.

This one confusion probably gave me the biggest difficulties when I initially tried to wrap my head around all of webpack and hot reloading to replace my existing browserify-based setup. Most tutorials seem to be written for either complete beginners who haven't previously used any transformations/loaders at all, or people who already fully understand how webpack works. There doesn't seem to be much content addressing intermediate users who want to convert real-world code bases to webpack.

1. I do not quite get why we do this using provideplugin.

    plugins.push(new webpack.ProvidePlugin({
            $: 'jquery',
            jQuery: 'jquery',
            React: 'react'
        }));
   

2. I know benefits of creating chunks of code. But I want to understand proper ways to create them and would like to know how webpacks makes them work internally.

I'm new with Webpack, but I found a lot of help in this article about the confusing parts with Webpack. Hope it helps!

I was trying to not use unknown part of Webpack a lot(even not use it at all these days by using ClojureScript). I think combining multiple loaders is hard to understand. I ran into problems like less-loader breaking something in css-loader and couldn't figure out why. Also, when I want to make plugins to customise, it's not as simple as loaders.

Difference between different types of devtool options and when to use which one.

eval
cheap-eval-source-map
cheap-source-map
cheap-module-eval-source-map
cheap-module-source-map
eval-source-map
source-map