fix(umd): fix the UMD bundle export names so they don't conflict and overwrite each other (#318)

Importing multiple UMD bundles into the same page was causing the global Ix object to be replaced
each time, rather than augmented. Exporting them to distinct global objects based on the file name
causes them not to conflict.

Author: trxcllnt

gulp/closure-task.js

@@ -19,6 +19,7 @@ const {
     targetDir,
     mainExport,
     esmRequire,
+    getUMDExportName,
     gCCLanguageNames,
     observableFromStreams,
     shouldRunInChildProcess,
@@ -58,7 +59,7 @@ const closureTask = ((cache) => memoizeTask(cache, async function closure(target
         const externsPath = path.join(out, `${entry}.externs.js`);
 
         await Promise.all([
-            fs.promises.writeFile(entry_point, generateUMDExportAssignnent(entry)),
+            fs.promises.writeFile(entry_point, generateUMDExportAssignment(entry)),
             fs.promises.writeFile(externsPath, generateExternsFile(path.resolve(`${src}/${entry}.js`)))
         ]);
 
@@ -73,15 +74,15 @@ const closureTask = ((cache) => memoizeTask(cache, async function closure(target
                 `${src}/**/*.js` /* <-- then sources globs  */
             ], { base: `./` }),
             sourcemaps.init(),
-            closureCompiler(createClosureArgs(entry_point, entry, externsPath)),
+            closureCompiler(createClosureArgs(entry_point, entry, externsPath, getUMDExportName(entry))),
             // rename the sourcemaps from *.js.map files to *.min.js.map
             sourcemaps.write(`.`, { mapFile: (mapPath) => mapPath.replace(`.js.map`, `.${target}.min.js.map`) }),
             gulp.dest(out)
         ).toPromise();
     }
 }))({});
 
-const createClosureArgs = (entry_point, output, externs) => ({
+const createClosureArgs = (entry_point, output, externs, libraryName) => ({
     externs,
     entry_point,
     third_party: true,
@@ -100,15 +101,15 @@ const createClosureArgs = (entry_point, output, externs) => ({
     language_out: gCCLanguageNames[`esnext`],
     output_wrapper: `(function (global, factory) {
     typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports) :
-    typeof define === 'function' && define.amd ? define(['exports'], factory) :
-    (factory(global.Ix = global.Ix || {}));
+    typeof define === 'function' && define.amd ? define(['${libraryName}'], factory) :
+    (factory(global.${libraryName} = global.${libraryName} || {}));
 }(this, (function (exports) {%output%}.bind(this))));`
 });
 
 module.exports = closureTask;
 module.exports.closureTask = closureTask;
 
-function generateUMDExportAssignnent(entry) {
+function generateUMDExportAssignment(entry) {
     return [`
 import { __await } from 'tslib';
 __await.prototype[Symbol.toStringTag] = '__await';

gulp/minify-task.js

@@ -18,6 +18,7 @@
 const {
     targetDir,
     mainExport,
+    getUMDExportName,
     UMDSourceTargets,
     terserLanguageNames,
     shouldRunInChildProcess,
@@ -57,6 +58,10 @@ const minifyTask = ((cache, commonConfig) => memoizeTask(cache, function minifyJ
     ].map((entry) => ({
         ...targetConfig,
         name: entry,
+        output: {
+            ...targetConfig.output,
+            library: getUMDExportName(entry)
+        },
         entry: { [entry]: path.resolve(`${src}/${entry}.js`) },
         plugins: [
             ...(targetConfig.plugins || []),

gulp/util.js

@@ -216,6 +216,12 @@ const esmRequire = require(`esm`)(module, {
     }
 });
 
+const getUMDExportName = (umdEntryFileName) => umdEntryFileName
+    .split('.')
+    .filter((x) => x != 'dom')
+    .map((x) => x[0].toUpperCase() + x.slice(1))
+    .join('');
+
 module.exports = {
 
     mainExport, npmPkgName, npmOrgName, metadataFiles, packageJSONFields,
@@ -224,5 +230,5 @@ module.exports = {
     gCCLanguageNames, UMDSourceTargets, terserLanguageNames,
 
     taskName, packageName, tsconfigName, targetDir, combinations, observableFromStreams,
-    ESKeywords, esmRequire, shouldRunInChildProcess, spawnGulpCommandInChildProcess
+    ESKeywords, esmRequire, shouldRunInChildProcess, spawnGulpCommandInChildProcess, getUMDExportName
 };