change the way inject-by-tag work (javascript obfuscator compatible)

package.json

@@ -22,7 +22,7 @@
     "babel-preset-node5": "^11.0.1",
     "babel-preset-react": "^6.5.0",
     "babel-preset-stage-2": "^6.22.0",
-    "chalk": "^1.1.3",
+    "chalk": "^2.4.2",
     "dateformat": "^2.0.0",
     "eslint": "^2.7.0",
     "eslint-config-airbnb": "^6.2.0",

src/components/inject-as-comment/inject-as-comment.js

@@ -89,7 +89,7 @@ export default class InjectAsComment {
       log.error(`unsupported tag in componentsOptions.InjectAsComment.tag [${tagName}]`);
       return tag;
     });
-    return `${baseOpen} ${tagPattern} ${baseClose}`;
+    return `${baseOpen.trim()} ${tagPattern} ${baseClose}`;
   }
 
   /**
@@ -101,8 +101,8 @@ export default class InjectAsComment {
    * @param asset
    */
   injectIntoCss(asset) {
-    let modAsset = this.parseTags(`/** [${config.SHORT}] `, ' **/ ');
-    modAsset += `${endOfLine} ${asset.source()} `;
+    let modAsset = this.parseTags(`/** ${config.SHORT}`, ' **/ ');
+    modAsset += `${endOfLine}${asset.source()} `;
     asset.source = () => modAsset;
   }
 
@@ -115,8 +115,8 @@ export default class InjectAsComment {
    * @param asset
    */
   injectIntoHtml(asset) {
-    let modAsset = this.parseTags(`<!-- [${config.SHORT}] `, ' --> ');
-    modAsset += `${endOfLine} ${asset.source()} `;
+    let modAsset = this.parseTags(`<!-- ${config.SHORT}`, ' --> ');
+    modAsset += `${endOfLine}${asset.source()} `;
     asset.source = () => modAsset;
   }
 
@@ -131,11 +131,11 @@ export default class InjectAsComment {
   injectIntoJs(asset) {
     let modAsset;
     if (this.context.config.componentsOptions.InjectAsComment.multiLineCommentType) {
-      modAsset = this.parseTags(`/** [${config.SHORT}] `, '*/ ');
+      modAsset = this.parseTags(`/** ${config.SHORT} `, '*/');
     } else {
-      modAsset = this.parseTags(`// [${config.SHORT}] `, ' ');
+      modAsset = this.parseTags(`// ${config.SHORT} `, '');
     }
-    modAsset += `${endOfLine} ${asset.source()} `;
+    modAsset += `${endOfLine}${asset.source()} `;
     asset.source = () => modAsset;
   }
 }

src/components/inject-by-tag/inject-by-tag.js

@@ -1,12 +1,14 @@
 import dateFormat from 'dateformat';
 import log from 'core/log';
 import config from 'config';
-
+import chalk from 'chalk'
 /**
  * Inject version number into HTML
  * - done by parsing html file,
  *   > replace: <{version}>
  */
+
+import { SourceMapSource, ReplaceSource, RawSource } from "webpack-sources";
 export default class InjectByTag {
 
   static componentName = 'InjectByTag';
@@ -21,44 +23,49 @@ export default class InjectByTag {
    * @return {Promise}
    */
   apply() {
-    this.context.compiler.plugin('emit', (compilation, cb) => {
-      // for every output file
-      for (const basename in compilation.assets) {
-        // only if match regex
-        if (this.context.config.componentsOptions.InjectByTag.fileRegex.test(basename)) {
-          let replaced = 0;
-          const asset = compilation.assets[basename];
-
-          const originalSource = asset.source();
-          if (!originalSource || typeof originalSource.replace !== 'function') {
-            continue;
-          }
-
-          const modFile = originalSource.replace(this.context.config.componentsOptions.InjectByTag.AIVTagRegexp, (tag) => {
-            // handle version
-            tag = tag.replace(/(\{)(version)(\})/g, () => {
-              return this.context.version;
-            });
-
-            // handle date
-            tag = tag.replace(/(\{)(date)(\})/g, () => {
-              return dateFormat(new Date(), config.componentsOptions.InjectByTag.dateFormat);
-            });
-
-            // remove [AIV] and [/AIV]
-            tag = tag.replace(/(\[AIV])|(\[\/AIV])/g, '');
-
-            replaced++;
-
-            return tag;
+    this.context.compiler.hooks.compilation.tap(InjectByTag.componentName, (compilation) => {
+      compilation.hooks.optimizeChunkAssets.tap(InjectByTag.componentName, (chunks) => {
+        chunks.forEach(chunk => {
+          chunk['files'].forEach((file) => {
+            if (!this.context.config.componentsOptions.InjectByTag.fileRegex.test(file))
+              return
+            let replaced = 0;
+            var asset = compilation.assets[file];
+            var newSource = new ReplaceSource(asset);
+            let AIVTagRegexp = this.context.config.componentsOptions.InjectByTag.AIVTagRegexp
+            let source = asset.source();
+            while (true) {
+              // source = newSource.source()
+              let match = AIVTagRegexp.exec(source)
+              if (!match) break
+              replaced++
+              let newVal = this.replace(match[0])
+              newSource.replace(match.index, match.index + match[0].length - 1, newVal)
+            }
+            compilation.assets[file] = newSource
+            log.info(`${chalk.red('InjectByTag')} : match : ${file} : replaced : ${replaced}`);
           });
+        });
+      })
 
-          asset.source = () => modFile;
-          log.info(`InjectByTag : match : ${basename} : replaced : ${replaced}`);
-        }
-      }
-      cb();
-    });
+    })
     return new Promise((resolve) => { resolve(); });
   }
+  replace(tag) {
+    // handle version
+    tag = tag.replace(/(\{)(version)(\})/g, () => {
+      return this.context.version;
+    });
+
+    // handle date
+    tag = tag.replace(/(\{)(date)(\})/g, () => {
+      return dateFormat(new Date(), this.context.config.componentsOptions.InjectByTag.dateFormat);
+    });
+
+    // remove [AIV] and [/AIV]
+    tag = tag.replace(/(\[AIV])|(\[\/AIV])/g, '');
+
+    return tag;
+  }
+
 }

src/config.js

@@ -1,5 +1,5 @@
 export default {
-  SHORT: 'AIV_SHORT',
+  SHORT: '[AIV_SHORT]',
   SILENT: false,
   PACKAGE_JSON_PATH: './package.json',
   PACKAGE_JSON_INDENT: 4,