Use in multiple entries with vue

[mosquito1994]

I'm using webpack-hot-middleware in multiple entries, I give each entry a path in the plugin config and I can see in the browser console [HMR] connected. When I update my file I see the webpack rebuild but never reload at all.

Some of my config looks like this:

const devMiddleware = require('webpack-dev-middleware');
const hotMiddleware = require('webpack-hot-middleware');
const app = express();
const webpackConfig = require(`../configs/webpack.dev.conf.js`);

dirs.forEach(function(dir, index) {
    let _config = new webpackConfig(dir);

    app.use(devMiddleware(webpack(_config), {
        publicPath: _config.output.publicPath
    }));
    app.use(hotMiddleware(webpack(_config), {
        path: `/${dir}/__webpack_hmr`
    }));
});

function getDirs(_dir) {
    return fs.readdirSync(_dir)
        .filter((_file) => {
            return fs.statSync(path.join(_dir, _file)).isDirectory()
        })
}

And in my webpack.dev.conf.js:

module.exports = function (dir) {
    /* some other config here */
    webEntry.push(`webpack-hot-middleware/client?reload=true&path=/${dir}/__webpack_hmr`);

    const webConfig = {
        entry: webEntry,
        output: {
          path: helper.rootNode('./dist', dir),
          filename: '[name].web.js',
          publicPath: `/${dir}`
       },
    /* some other config here */

    return webConfig;
}

Also I add new webpack.HotModuleReplacementPlugin() in my plugin list.

It seems everything works well except that I can never see a reload after my changes. I'm using this in my vue project. Is it anything wrong with my config ? Thanks for your help in advance.

[Dave Honneffer]

The edited version of your config might be missing something important. F.ex you've edited out that you import webpack somewhere. :)

That being said, have you tried:

dirs.forEach(function(dir, index) {
    const _config = new webpackConfig(dir);
    const compiler = webpack(_config)
    app.use(devMiddleware(compiler, {
        publicPath: _config.output.publicPath
    }));
    app.use(hotMiddleware(compiler, {
        path: `/${dir}/__webpack_hmr`
    }));
});

In general, it's much better to provide a working reproduction instead of copying and pastings bits and pieces - and kinda bad form to file an issue for tech support instead of asking StackOverflow. ;)

[mosquito1994]

https://github.com/mosquito1994/testWeex

Here I've upload the project. The webpack config is configs/webpack.dev.conf.js, and lauched in scripts/dev.js. Hope someone can help me figure out the point here. Thank you very much!