fix: compatibility with webpack@4 and webpack@5 for monorepos (#636)

Author: evilebottnawi

src/index.js

@@ -20,8 +20,6 @@ const {
   util: { createHash },
 } = webpack;
 
-const isWebpack4 = webpackVersion[0] === '4';
-
 const pluginName = 'mini-css-extract-plugin';
 
 const REGEXP_CHUNKHASH = /\[chunkhash(?::(\d+))?\]/i;
@@ -97,16 +95,12 @@ class MiniCssExtractPlugin {
         this.options.chunkFilename = '[id].css';
       }
     }
-
-    if (!isWebpack4 && 'hmr' in this.options) {
-      throw new Error(
-        "The 'hmr' option doesn't exist for the mini-css-extract-plugin when using webpack 5 (it's automatically determined)"
-      );
-    }
   }
 
   /** @param {import("webpack").Compiler} compiler */
   apply(compiler) {
+    const isWebpack4 = compiler.webpack ? false : webpackVersion[0] === '4';
+
     if (!isWebpack4) {
       const { splitChunks } = compiler.options.optimization;
       if (splitChunks) {
@@ -200,7 +194,9 @@ class MiniCssExtractPlugin {
 
             // We don't need hot update chunks for css
             // We will use the real asset instead to update
-            if (chunk instanceof webpack.HotUpdateChunk) return;
+            if (chunk instanceof webpack.HotUpdateChunk) {
+              return;
+            }
 
             const renderedModules = Array.from(
               this.getChunkModules(chunk, chunkGraph)
@@ -439,7 +435,10 @@ class MiniCssExtractPlugin {
       } else {
         const enabledChunks = new WeakSet();
         const handler = (chunk, set) => {
-          if (enabledChunks.has(chunk)) return;
+          if (enabledChunks.has(chunk)) {
+            return;
+          }
+
           enabledChunks.add(chunk);
 
           // eslint-disable-next-line global-require

src/loader.js

@@ -16,8 +16,6 @@ import schema from './loader-options.json';
 
 const pluginName = 'mini-css-extract-plugin';
 
-const isWebpack4 = webpackVersion[0] === '4';
-
 function hotLoader(content, context) {
   const accept = context.locals
     ? ''
@@ -105,6 +103,8 @@ export function pitch(request) {
 
   let source;
 
+  const isWebpack4 = childCompiler.webpack ? false : webpackVersion[0] === '4';
+
   if (isWebpack4) {
     childCompiler.hooks.afterCompile.tap(pluginName, (compilation) => {
       source =