HMR not working as expected, reloads page instead

Hot reloading components does not work at the moment (used to work just fine).

Describe the issue / bug.

When setting up a new project, hot reloading does not work. It used to work, I have a project from about 2 weeks ago (setup the same way) where it works just fine.

How can I reproduce this problem?

• Setup a new project: vue init simulatedgreg/electron-vue my-project
• Install dependencies: yarn
• Start: yarn run dev
• Make a change in the HTML of a component, eg. change a text in src/renderer/components/LandingPage/SystemInformation.vue

It will reload the whole app instead of hot-reloading the component.

Tell me about your development environment.

• Node version: 8.4.0
• NPM version: 5.5.1
• Yarn version: 1.0.1
• vue-cli version: 2.9.1
• Operating System: Darwin

[nwittwer]

After quite some time looking for a solution to this on my own project, I realized that the webpack-dev-server package actually has a built-in option for HMR (hot module reloading), so it may not be necessary to use the additional webpack-hot-middleware from the current setup. Simply adding hot: true to the Webpack Dev Server options made it all work as you’d expect—see below for example change.

Open up .electron-vue/dev-runner.js and change from

const server = new WebpackDevServer(
      compiler,
      {
        contentBase: path.join(__dirname, '../'),
        quiet: true,
        before (app, ctx) {
          app.use(hotMiddleware)
          ctx.middleware.waitUntilValid(() => {
            resolve()
          })
        }
      }
    )

to

const server = new WebpackDevServer(
      compiler, {
        contentBase: path.join(__dirname, '../'),
        quiet: true,
        hot: true, // <-- the fix!
        before(app, ctx) {
          // app.use(hotMiddleware) // <-- not necessary!
          ctx.middleware.waitUntilValid(() => {
            resolve()
          })
        }
      }
    )

There’s more details about the hot option here: https://webpack.js.org/configuration/dev-server/#devserverhot.

NOTE: I’ve updated a few versions from this template’s default versions: Electron 6.0.4, Webpack 4.39.2, webpack-dev-server 3.8.0

[rmartinm]

I have the same issue. I found a workaround, In the file dev-client.js i commented line 8 (window.location.reload()) And HMR work as espected.