Search code examples
csswebpackwebpack-style-loader

Webpack behavior with css page loads without style then flashes


Because I'm using Webpack to also bundle my css and that my script tag is at the bottom of my HTML, on initial page load I get the content of the page without any of the styling.

Then all of a sudden the styling comes in when the script kicks in.

Webpack is very useful to help bundle the CSS but this behavior is quite unsettling and not really acceptable.

What are common ways to remedy this problem?


Solution

  • You can try using extract-text-webpack-plugin to break out the css in to their own files. That way you can add <link> tags yourself to those pages you wish to have their styles loaded before the JS is loaded. See stylesheets as separate bundle.