books/webpack/serve.js

const webpack = require('webpack');
const webpackDevServer = require('webpack-dev-server');
const webpackDevMiddleware = require('webpack-dev-middleware');
const webpackHotMiddleware = require('webpack-hot-middleware');

const logger = require('./logger');
const { getAppConfig, resolveAppDir } = require('./utils');
const { getConfig: getWebpackConfig } = require('./config');

const log = logger('serve');
const warn = logger('serve', 'red');

const appConfig = getAppConfig();
const webpackConfig = getWebpackConfig();

function addWebpackMiddleware(app) {
    log();
    log('Starting dev server...');

    addWebpackEntryPoints(webpackConfig);
    const compiler = webpack(webpackConfig);

    app.use(webpackDevMiddleware(compiler, {
        logLevel: 'silent',
        publicPath: webpackConfig.output.publicPath
    }));

    app.use(webpackHotMiddleware(compiler, {
        path: '/__webpack_hmr'
    }));
}

function startWebpackDevServer() {
    log();
    log('Starting dev server...');

    return new Promise(resolve => {
        addWebpackEntryPoints(webpackConfig, true);
        const compiler = webpack(webpackConfig);
        const server = new webpackDevServer(compiler, webpackConfig.devServer);

        const { devServerHost, devServerPort } = appConfig.dev;
        server.listen(devServerPort, devServerHost, () => {
            // listening on devServerPort

            compiler.hooks.done.tap('webpack done compiling', function() {
                resolve(server);
            });
        });
    })
}

function addWebpackEntryPoints(webpackConfig, forDevServer) {
    const devServerEntryPoints = [
        // resolveAppDir('node_modules/webpack-dev-server/client/index.js') + '?http://localhost',
        'webpack-dev-server/client/index.js?http://localhost',
        'webpack/hot/dev-server'
    ];
    const middlewareEntryPoints = [
        'webpack-hot-middleware/client?path=/__webpack_hmr'
    ];
    const entryPoints = forDevServer ? devServerEntryPoints : middlewareEntryPoints;
    const entry = webpackConfig.entry;

    Object.keys(entry).forEach(key => {
        entry[key] = [...entryPoints, entry[key]];
    });
}



module.exports = {
    addWebpackMiddleware,
    startWebpackDevServer
}