Automatic Refresh With Webpack in Electron

Question

I have an Electron/Webpack project to which I am trying to add automatic refresh on file change. Per the documentation, I've taken the following steps:

1. I added webpack-dev-server to my project.

2. I added the following to my webpack.config.js:

   devServer: {
       inline: true
   }
   

3. And I run webpack with the command webpack-dev-server --progress --colors

When I make changes to my entry file, they are not reflected in the emitted code at http://localhost:8080/build/index.js (where I have set my output to go). What am I missing?

For completeness, here is my webpack config:

module.exports = {
    entry: './src/index.tsx',
    output: {
        filename: './build/index.js'
    },
    resolve: {
        extensions: ['', '.webpack.js', '.web.js', '.ts', '.js', '.tsx', '.jsx']
    },
    module: {
        loaders: [
            { test: /\.tsx?$/, loader: 'awesome-typescript-loader' }
        ]
    },
    devServer: {
        inline: true
    }
}

Answer 1

maybe my test-boilerplate will give you some inspirations, the "web" environment offers HMR development:

https://github.com/wende60/Electron-Webpack2-React-Sass

cheers, joachim