Hot module replacement

[jantimon]

This pull request adds hot module replacement to the extract-text-webpack-plugin.

[BohdanTkachenko]

Any chance that this PR can be merged?

[jantimon]

Also the documentation said that hot module replacement might be used in production @sokra told me in gitter that he doesn't plan to merge this feature as hmr works seamless without the extract-text-webpack plugin

[readme42]

Would love to use ExtractTextPlugin with HMR!

Scenario: multiple css-themes which are extracted to static css files.

[TrejGun]

👍

[p0wl]

👍 maybe enable it via a configuration flag, so it is not a problem for people using hmr in production.

[Sinkler]

👍

[epsyl]

👍

[phpdude]

👍🏻

[Koshub]

👍

[ziogaschr]

👍

[valerymercury]

👍

[vladmiller]

👍 Indeed would be very useful feature.

[valerybugakov]

@jantimon can you please suggest how to use your patched version of extract-text-plugin with HMR? I tried your forked repo but it doesn't work for me :( Still getting:

[HMR] The following modules couldn't be hot updated: (They would need a full reload!)

[jantimon]

@valerybugakov The merge request worked - but this was Jul 2015. As this won't be merged anyway I don't want to spent time on it.

[valerybugakov]

@jantimon are you using HMR for CSS right now somehow? Or just switched to another tool.

[jantimon]

I disabled extract text plugin for hmr (in this example if config.dev is true):

module: {
    loaders: [{
    {
      test: /\.less$/,
      loader: ExtractTextPlugin.extract(
        "style",
        "css-loader",
        "less"
      )
    }],
   plugins: [
      new ExtractTextPlugin("static/styles.css", {
        disable: config.dev
   })

[dmydry]

👍 Merge it please

[TrejGun]

@valerybugakov try this fork
https://github.com/TrejGun/extract-text-webpack-plugin

[valerybugakov]

@TrejGun ok, will try, thanks!

[TrejGun]

:( doesn't work with eval but works with source-map

[jantimon]

And inline-source-map

[shepherdwind]

I just write a loader(css-hot-loader), which supprot hot module replacement for an extracted css file.

If you don't want use style-loader, maybe you should have a try.

[bebraw]

@jantimon Are you still interested? I expect the PR might need some tweaks to make this work in 2 series.

[jantimon]

@bebraw thanks for picking this up but I abandoned the related project two years ago because of missing webpack features - the solution is quite simple so it might still work :)

[bebraw]

@jantimon Alright. Let's leave this open for now in case someone wants to pick it up for a future release.

[msuperina]

Hi I would like to pick up this one, and have 2 options to propose:

• either modify the bundle each time an asset changes: at the moment "// removed by extract-text-webpack-plugin" is written, we could add the hash to this comment
  this way it is possible to call module.hot.accept("path/to/asset") in the client application, but then the client would have to manually handle the path of the external resource to reload
• or add a step to the compilation process that takes the output filename and add to the bundle some code that would reload the external resource automatically, like the solution proposed
  Note that in both cases I would only modify the loader.js file, not the index.js
  Also, the code could be handled by a plugin if you prefer
  Finally, an option "hmr: true" could be added to the plugin configuration to enable this feature
  Can you tell me what you prefer before I create a PR please ?

[bebraw]

@msuperina Latter sounds good to me especially since then the client doesn't need to worry about dealing with external resources.

@d3viant0ne Any thoughts on this?

[joshwiens]

Definitely the latter imo.

[DanielBadan]

@msuperina Any progress with the PR?

[bebraw]

@danielverejan Nah. We investigated it, but it's a tough problem (hard code). An interesting way to work around the problem is to go with extract-loader. It's not the same, but still worth a look.

[FrankFan]

This is a very useful feature.
It's better to be merged into next version.

[bebraw]

If someone wants to work on this, please open a separate PR. It's a surprisingly tough problem to solve neatly.

[daryn-k]

Why does not it work for me?

ERROR in ./src/components/App/bootstrap.css
eacthabr-appound Error: Cannot find module "C:site.dev
eactapp
ode_modulesextract-text-webpack-pluginhotModuleReplacement.js"

No idea why a path is such

[Plortinus]

Does HMR work in version3.0.0?