Skip to content

ExtractTextPlugin production configuration #408

Closed
@insin

Description

@insin

ExtractTextPlugin only extracts the entry chunk's CSS out into a CSS bundle by default.

If you have more than one bundle importing CSS, it also bundles up the not-insignificantly sized addStyles.js from style-loader and injects additional bundles' CSS on the fly.

If you use the allChunks: true option, it will extract CSS from all additional chunks into the CSS bundle and also skip bundling of addStyles.js.

Here are some numbers from cloning App.js/App.css as More.js/More.css and importing More.js. inside a require.ensure() to put it in a new chunk:

Current Config With allChunks: true
mintty_2016-08-09_17-39-06 mintty_2016-08-09_17-39-21

New config in webpack.config.prod.js would be:

new ExtractTextPlugin('static/css/[name].[contenthash:8].css', {
  allChunks: true
})

Want a PR for this change? It seems like a sensible default way to handle production CSS.

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions