Skip to content

Better HMR story for css-modules :) #669

@lydell

Description

@lydell

Do you want to request a feature or report a bug?
feature

What is the current behavior?
I have enabled CSS HMR. It’s awesome!

If I enable css-modules, saving a CSS file now results in the whole page being reloaded. As mentioned #139 this is correct: JS files imports class names from CSS file, and those could have changed.

I think we can do better though :)

What is the expected behavior?

webpack should only reload the full page if it really has to.

Most of the time, I fiddle with values for width, padding and margin. Only changing those should not need a full reload, right?

  • Only adding, removing or changing properties should not cause a full reload.
  • Adding, removing or changing rules/selectors should cause a full reload.

If something like the above isn’t possible, I would suggest an “I know what I’m doing and accept the downsides” option, that tells webpack to never do a full reload when a CSS file changes, leaving it up to the user to manually reload when they change class names.

If this is a feature request, what is motivation or use case for changing the behavior?

CSS HMR is such a productivity boost! It’s so sad to see it go when enabling css-modules.

Please mention other relevant information such as your webpack version, Node.js version and Operating System.

webpack version: 3.10.0
Node.js version: 8.9.4
Operating System: Ubuntu 16.04

Metadata

Metadata

Assignees

No one assigned

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions