bug #899 Fixing support for webpack-dev-server v4 (weaverryan)

This PR was squashed before being merged into the main branch.

Discussion
----------

Fixing support for webpack-dev-server v4

Fixes #893

Commits
-------

23a981f Fixing support for webpack-dev-server v4

Author: weaverryan

CHANGELOG.md

@@ -12,7 +12,7 @@
    * `terser-webpack-plugin` from 1 to 5
    * `webpack-cli` from 3 to 4
    * `webpack-manifest-plugin` from 2 to 3
-   * `webpack-manifest-plugin` from 3 to 4-beta
+   * `webpack-dev-server` from 3 to 4-beta [CHANGELOG](https://github.com/webpack/webpack-dev-server/blob/master/CHANGELOG.md#400-beta0-2020-11-27)
 
  * [DEPENDENCY SUPPORT CHANGES] Encore has changed what versions it supports
    of the following packages:

bin/encore.js

@@ -77,7 +77,6 @@ function showUsageInstructions() {
     console.log(`    ${chalk.green('dev-server')} : runs webpack-dev-server`);
     console.log(`       - ${chalk.yellow('--host')} The hostname/ip address the webpack-dev-server will bind to`);
     console.log(`       - ${chalk.yellow('--port')} The port the webpack-dev-server will bind to`);
-    console.log(`       - ${chalk.yellow('--hot')}  Enable HMR on webpack-dev-server`);
     console.log(`       - ${chalk.yellow('--keep-public-path')} Do not change the public path (it is usually prefixed by the dev server URL)`);
     console.log('       - Supports any webpack-dev-server options');
     console.log();

lib/WebpackConfig.js

@@ -995,10 +995,6 @@ class WebpackConfig {
         return this.runtimeConfig.devServerHttps;
     }
 
-    useHotModuleReplacementPlugin() {
-        return this.runtimeConfig.useHotModuleReplacement;
-    }
-
     isProduction() {
         return this.runtimeConfig.environment === 'production';
     }

lib/config-generator.js

@@ -570,17 +570,15 @@ class ConfigGenerator {
         const contentBase = pathUtil.getContentBase(this.webpackConfig);
 
         const devServerOptions = {
-            contentBase: contentBase,
-            // this doesn't appear to be necessary, but here in case
-            publicPath: this.webpackConfig.getRealPublicPath(),
+            static: {
+                directory: contentBase,
+                // this doesn't appear to be necessary, but here in case
+                publicPath: this.webpackConfig.getRealPublicPath(),
+            },
             // avoid CORS concerns trying to load things like fonts from the dev server
             headers: { 'Access-Control-Allow-Origin': '*' },
-            hot: this.webpackConfig.useHotModuleReplacementPlugin(),
-            // required by FriendlyErrorsWebpackPlugin
-            quiet: true,
             compress: true,
             historyApiFallback: true,
-            watchOptions: this.buildWatchOptionsConfig(),
             https: this.webpackConfig.useDevServerInHttps()
         };
 

lib/config/RuntimeConfig.js

@@ -20,7 +20,6 @@ class RuntimeConfig {
         this.devServerUrl = null;
         this.devServerHttps = null;
         this.devServerKeepPublicPath = false;
-        this.useHotModuleReplacement = false;
         this.outputJson = false;
         this.profile = false;
 

lib/config/parse-runtime.js

@@ -42,7 +42,6 @@ module.exports = function(argv, cwd) {
 
             runtimeConfig.useDevServer = true;
             runtimeConfig.devServerHttps = argv.https;
-            runtimeConfig.useHotModuleReplacement = argv.hot || false;
             runtimeConfig.devServerKeepPublicPath = argv.keepPublicPath || false;
 
             if (typeof argv.public === 'string') {

test/config-generator.js

@@ -613,33 +613,6 @@ describe('The config-generator function', () => {
             expect(actualConfig.devServer).to.be.undefined;
         });
 
-        it('devServer no hot mode', () => {
-            const config = createConfig();
-            config.runtimeConfig.useDevServer = true;
-            config.runtimeConfig.devServerUrl = 'http://localhost:8080/';
-            config.runtimeConfig.useHotModuleReplacement = false;
-            config.outputPath = isWindows ? 'C:\\tmp\\public' : '/tmp/public';
-            config.setPublicPath('/');
-            config.addEntry('main', './main');
-
-            const actualConfig = configGenerator(config);
-            expect(actualConfig.devServer).to.not.be.undefined;
-            expect(actualConfig.devServer.hot).to.be.false;
-        });
-
-        it('hot mode', () => {
-            const config = createConfig();
-            config.runtimeConfig.useDevServer = true;
-            config.runtimeConfig.devServerUrl = 'http://localhost:8080/';
-            config.runtimeConfig.useHotModuleReplacement = true;
-            config.outputPath = isWindows ? 'C:\\tmp\\public' : '/tmp/public';
-            config.setPublicPath('/');
-            config.addEntry('main', './main');
-
-            const actualConfig = configGenerator(config);
-            expect(actualConfig.devServer.hot).to.be.true;
-        });
-
         it('devServer with custom options', () => {
             const config = createConfig();
             config.runtimeConfig.useDevServer = true;
@@ -664,59 +637,6 @@ describe('The config-generator function', () => {
                 },
             });
         });
-
-        it('devServer with custom watch options', () => {
-            const config = createConfig();
-            config.runtimeConfig.useDevServer = true;
-            config.runtimeConfig.devServerUrl = 'http://localhost:8080/';
-            config.runtimeConfig.useHotModuleReplacement = true;
-            config.outputPath = isWindows ? 'C:\\tmp\\public' : '/tmp/public';
-            config.setPublicPath('/');
-            config.addEntry('main', './main');
-
-            config.configureWatchOptions(watchOptions => {
-                watchOptions.poll = 250;
-            });
-
-            const actualConfig = configGenerator(config);
-
-            expect(actualConfig.watchOptions).to.deep.equals({
-                'ignored': /node_modules/,
-                'poll': 250,
-            });
-            expect(actualConfig.devServer.watchOptions).to.deep.equals({
-                'ignored': /node_modules/,
-                'poll': 250,
-            });
-        });
-
-        it('devServer with custom options and watch options', () => {
-            const config = createConfig();
-            config.runtimeConfig.useDevServer = true;
-            config.runtimeConfig.devServerUrl = 'http://localhost:8080/';
-            config.runtimeConfig.useHotModuleReplacement = true;
-            config.outputPath = isWindows ? 'C:\\tmp\\public' : '/tmp/public';
-            config.setPublicPath('/');
-            config.addEntry('main', './main');
-
-            config.configureWatchOptions(watchOptions => {
-                watchOptions.poll = 250;
-            });
-            config.configureDevServerOptions(options => {
-                // should take precedence over `configureWatchOptions()`
-                options.watchOptions.poll = 500;
-            });
-
-            const actualConfig = configGenerator(config);
-            expect(actualConfig.watchOptions).to.deep.equals({
-                'ignored': /node_modules/,
-                'poll': 250,
-            });
-            expect(actualConfig.devServer.watchOptions).to.deep.equals({
-                'ignored': /node_modules/,
-                'poll': 500,
-            });
-        });
     });
 
     describe('test for addPlugin config', () => {

test/config/parse-runtime.js

@@ -68,7 +68,6 @@ describe('parse-runtime', () => {
         expect(config.environment).to.equal('dev');
         expect(config.useDevServer).to.be.true;
         expect(config.devServerUrl).to.equal('http://localhost:8080/');
-        expect(config.useHotModuleReplacement).to.be.false;
         expect(config.devServerKeepPublicPath).to.be.false;
     });
 
@@ -132,14 +131,6 @@ describe('parse-runtime', () => {
         expect(config.babelRcFileExists).to.be.true;
     });
 
-    it('dev-server command hot', () => {
-        const testDir = createTestDirectory();
-        const config = parseArgv(createArgv(['dev-server', '--hot']), testDir);
-
-        expect(config.useDevServer).to.be.true;
-        expect(config.useHotModuleReplacement).to.be.true;
-    });
-
     it('dev-server command --keep-public-path', () => {
         const testDir = createTestDirectory();
         const config = parseArgv(createArgv(['dev-server', '--keep-public-path']), testDir);