Vue-loader: Hot Module Reloading Broken when using CSS modules

[trainiac]

Version

12.2.1

Reproduction link

https://github.com/trainiac/hmr-vue-loader-12-bug

Steps to reproduce

1. Run the server
   $ git clone [email protected]:trainiac/hmr-vue-loader-12-bug.git
   $ cd hmr-vue-loader-12-bug
   $ npm install
   $ node ./server.js

2. Edit anything in the script section of App.vue and save

3. Notice the error in the console.

What is expected?

Hot update

What is actually happening?

An error is being thrown

Uncaught TypeError: Cannot read property 'hot' of undefined

---

I've tested vue-loader 11.0.0 and this bug does not exist. I also don't get this bug without using CSS modules.

[trainiac]

I'm reopening this because it appears to still be broken. https://github.com/vuejs/vue-loader/issues/801

[trainiac]

I submitted a PR to webpack. Could be a bug on their end. https://github.com/webpack/webpack/pull/5281

[Allenice]

HMR broken when using css module with src

<style src="./list.scss" lang="scss" module></style>

[aronsuarez]

When you are using a preprocessor it breaks hot reload, work only with plain css in your css modules then works all fine.

Best