chore(build): upgrade to webpack 5

build/version_plugin.js

@@ -1,3 +1,4 @@
+const webpack = require('webpack');
 const gitRevSync = require('git-rev-sync');
 const pkg = require('../package.json');
 
@@ -17,15 +18,19 @@ const version = JSON.stringify({
 
 class VersionPlugin {
   apply(compiler) {
-    compiler.hooks.emit.tap('VersionPlugin', compilation => {
-      compilation.assets['version.json'] = {
-        source() {
-          return version;
+    compiler.hooks.thisCompilation.tap('VersionPlugin', compilation => {
+      compilation.hooks.processAssets.tap(
+        {
+          name: 'VersionPlugin',
+          stage: webpack.Compilation.PROCESS_ASSETS_STAGE_ADDITIONAL
         },
-        size() {
-          return version.length;
+        () => {
+          compilation.emitAsset(
+            'version.json',
+            new webpack.sources.RawSource(version)
+          );
         }
-      };
+      );
     });
   }
 }

common/assets.js

@@ -31,11 +31,12 @@ const instance = {
   match: getMatches,
   setMiddleware: function(middleware) {
     function getManifest() {
-      return JSON.parse(
-        middleware.fileSystem.readFileSync(
-          middleware.getFilenameFromUrl('/manifest.json')
-        )
-      );
+      // webpack-dev-middleware v5+: outputFileSystem lives on context
+      const fs = middleware.context
+        ? middleware.context.outputFileSystem
+        : middleware.fileSystem;
+      const file = middleware.getFilenameFromUrl('/manifest.json');
+      return JSON.parse(fs.readFileSync(file));
     }
     if (middleware) {
       instance.get = function getAssetWithMiddleware(name) {