feat(interop): extract-text-webpack-plugin with allChunks: true interoperability

Author: kisenka

lib/utils.js

@@ -3,7 +3,7 @@ const webpackPkg = require('webpack/package.json');
 // eslint-disable-next-line import/no-extraneous-dependencies
 const ruleMatcher = require('webpack/lib/ModuleFilenameHelpers').matchObject;
 const { parseQuery } = require('loader-utils');
-
+const escapeRegExpSpecialChars = require('escape-string-regexp');
 const defaults = require('./config');
 
 const loaderDefaults = defaults.loader;
@@ -51,10 +51,19 @@ module.exports.stringifySymbol = stringifySymbol;
  * @return {string}
  */
 function replaceSpritePlaceholder(content, replacements) {
-  const regexp = defaults.SPRITE_PLACEHOLDER_PATTERN;
-  return content.replace(regexp, (match, p1) => {
-    return p1 ? replacements[p1] : match;
-  });
+  let result = content;
+  Object.keys(replacements)
+    .map((subj) => {
+      return {
+        subj,
+        re: new RegExp(escapeRegExpSpecialChars(subj), 'g')
+      };
+    })
+    .forEach(({ subj, re }) => {
+      result = result.replace(re, replacements[subj]);
+    });
+
+  return result;
 }
 
 module.exports.replaceSpritePlaceholder = replaceSpritePlaceholder;
@@ -79,11 +88,12 @@ function replaceInModuleSource(module, replacements) {
 module.exports.replaceInModuleSource = replaceInModuleSource;
 
 /**
+ * Because of extract-text-webpack-plugin interop returns just absolute path to filepath
  * @param {string} filepath
  * @return {string}
  */
 function generateSpritePlaceholder(filepath) {
-  return `{{sprite-filename|${filepath}}}`;
+  return filepath;
 }
 
 module.exports.generateSpritePlaceholder = generateSpritePlaceholder;
@@ -252,14 +262,35 @@ function getModuleChunk(module, modules) {
   if (Array.isArray(chunks) && chunks.length > 0) {
     return chunks[chunks.length - 1];
   } else if (issuer) {
-    return getModuleChunk(issuer);
+    return getModuleChunk(issuer, modules);
   }
 
   return null;
 }
 
 module.exports.getModuleChunk = getModuleChunk;
 
+/**
+ * extract-text-webpack-plugin compatible
+ * @param {Compilation} compilation
+ * @return {NormalModule[]}
+ */
+function getAllModules(compilation) {
+  const allModules = compilation.modules;
+  let modules = allModules.filter(isModuleShouldBeExtracted);
+
+  // Search in child compilations
+  if (compilation.children.length > 0) {
+    modules = compilation.children.reduce((acc, childCompilation) => {
+      return acc.concat(childCompilation.modules);
+    }, modules);
+  }
+
+  return modules;
+}
+
+module.exports.getAllModules = getAllModules;
+
 /**
  * // TODO implement [chunkhash]
  * @param {string} filename
@@ -282,7 +313,7 @@ module.exports.interpolateSpriteFilename = interpolateSpriteFilename;
  */
 function aggregate(symbols, compilation) {
   const { compiler } = compilation;
-  const allModules = compilation.modules;
+  const allModules = getAllModules(compilation);
   const modules = allModules.filter(isModuleShouldBeExtracted);
   const publicPath = compiler.options.output.publicPath || '';
   const rules = getLoadersRules(compiler);

package.json

@@ -30,6 +30,7 @@
     "bluebird": "^3.5.0",
     "deepmerge": "1.3.2",
     "domready": "1.0.8",
+    "escape-string-regexp": "1.0.5",
     "loader-utils": "^1.1.0",
     "svg-baker": "^1.2.6",
     "svg-baker-runtime": "^1.2.1",