@eui/tools 6.20.22 → 6.20.23

package/.version.properties

@@ -1 +1 @@
-6.20.22
+6.20.23

package/CHANGELOG.md

@@ -1,3 +1,13 @@
+## 6.20.23 (2024-09-05)
+
+##### Chores
+
+* **other:**
+  * improve names MWP-11061 [MWP-11061](https://webgate.ec.europa.eu/CITnet/jira/browse/MWP-11061)  ([bd68b63d](https://webgate.ec.europa.eu/CITnet/stash/scm/csdr/eui-tools.git/commits/bd68b63de9a4208d6aa667d1c5f0b88c26661ae2))
+  * support esbuild build + bundle files in order to load elements as js modules MWP-11061 [MWP-11061](https://webgate.ec.europa.eu/CITnet/jira/browse/MWP-11061)  ([967657f5](https://webgate.ec.europa.eu/CITnet/stash/scm/csdr/eui-tools.git/commits/967657f5708153ae24360407a62f015fdbf03633))
+
+* * *
+* * *
 ## 6.20.22 (2024-09-03)
 
 ##### Chores

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@eui/tools",
-    "version": "6.20.22",
+    "version": "6.20.23",
     "tag": "latest",
     "license": "EUPL-1.1",
     "description": "eUI common tools and scripts",

package/scripts/utils/build/package/element.js

@@ -87,8 +87,8 @@ module.exports.build = (pkg, isMaster) => {
           return tools.runNodeScriptProcessOutput(args, pkg.paths.root);
 
         } else {
-        return execa('node', args, { cwd: pkg.paths.root, stdio: 'inherit' });
-      }
+          return execa('node', args, { cwd: pkg.paths.root, stdio: 'inherit' });
+        }
       }
     })
 
@@ -96,8 +96,7 @@ module.exports.build = (pkg, isMaster) => {
     .catch((e) => {
       throw e;
     });
-}
-
+};
 
 
 module.exports.postBuild = (pkg, version) => {
@@ -110,44 +109,62 @@ module.exports.postBuild = (pkg, version) => {
 
   if (dryRun) {
     tools.logInfo('DRY-RUN...skipping');
-    return;
-
   } else {
     return Promise.resolve()
-    .then(() => {
-      tools.logTitle('ELEMENT POST build');
-      tools.logInfo('Copying dist to bundles folder');
-      tools.mkdir(path.join(pkg.paths.dist, 'bundles'));
-      if (euiVersionNumber >= 18) {
-        tools.copydirFiles(path.join(pkg.paths.dist, 'browser'), path.join(pkg.paths.dist));
-        tools.remove(path.join(pkg.paths.dist, 'browser'));
-      }
-      tools.copydir(path.join(pkg.paths.dist), path.join(pkg.paths.dist, 'bundles'));
-    })
+      .then(() => {
+        tools.logTitle('ELEMENT POST build');
+        tools.logInfo('Copying dist to bundles folder');
+        tools.mkdir(path.join(pkg.paths.dist, 'bundles'));
 
-    .then(() => {
-      return remotesUtils.concatFiles(pkg, path.join(pkg.paths.dist, 'bundles'), euiVersionNumber);
-    })
+        // remove browser folder for esbuild builds
+        const isEsbuild = pkg?.build?.esbuild !== undefined ?? false;
 
-    .then(() => {
-      return remotesUtils.copyPackageJson(pkg.paths.root, pkg.paths.dist, remoteEuiVersion);
-    })
+        if (isEsbuild) {
+          tools.copydirFiles(path.join(pkg.paths.dist, 'browser'), path.join(pkg.paths.dist));
+          tools.remove(path.join(pkg.paths.dist, 'browser'));
+        }
+        tools.copydir(path.join(pkg.paths.dist), path.join(pkg.paths.dist, 'bundles'));
+      })
 
-    .then(() => {
-      tools.logInfo(`Renaming main.js file to current version : ${version}`);
-      return tools.move(path.join(pkg.paths.dist, 'bundles', 'main.js'), path.join(pkg.paths.dist, 'bundles', 'main-' + version + '.js'));
-    })
+      .then(() => {
+        // Note: it's limited to 18, but it could be applied to 15 / 16 / 17 / 18
+        const loadedAsJsModule = euiVersionNumber >= 18;
 
-    .then(() => {
-      return remotesUtils.emptyIndexHtml(pkg, path.join(pkg.paths.dist, 'bundles'));
-    })
+        if (loadedAsJsModule) {
+          return remotesUtils.createEntryJsFile(pkg, path.join(pkg.paths.dist, 'bundles'), euiVersionNumber);
+        } else {
+          return remotesUtils.concatFiles(pkg, path.join(pkg.paths.dist, 'bundles'), euiVersionNumber);
+        }
+      })
 
-    .then(() => {
-      return remotesUtils.cleanupUnusedAssets(path.join(pkg.paths.dist, 'bundles', 'assets'), euiVersionNumber);
-    })
+      .then(() => {
+        // Note: it's limited to 18, but it could be applied to 15 / 16 / 17 / 18
+        const loadedAsJsModule = euiVersionNumber >= 18;
 
-    .catch((e) => {
-      throw e;
-    })
+        const name = loadedAsJsModule ? 'entry' : undefined;
+        return remotesUtils.copyPackageJson(pkg, pkg.paths.root, pkg.paths.dist, remoteEuiVersion, name);
+      })
+
+      .then(() => {
+        tools.logInfo(`Renaming main.js or entry.js file to current version : ${version}`);
+
+        // Note: it's limited to 18, but it could be applied to 15 / 16 / 17 / 18
+        const loadedAsJsModule = euiVersionNumber >= 18;
+
+        const name = loadedAsJsModule ? 'entry' : 'main';
+        return tools.move(path.join(pkg.paths.dist, 'bundles', `${name}.js`), path.join(pkg.paths.dist, 'bundles', `${name}-` + version + '.js'));
+      })
+
+      .then(() => {
+        return remotesUtils.emptyIndexHtml(pkg, path.join(pkg.paths.dist, 'bundles'));
+      })
+
+      .then(() => {
+        return remotesUtils.cleanupUnusedAssets(path.join(pkg.paths.dist, 'bundles', 'assets'), euiVersionNumber);
+      })
+
+      .catch((e) => {
+        throw e;
+      });
   }
-}
+};

package/scripts/utils/remotes/remotes-utils.js

@@ -7,119 +7,149 @@ const concat = require('concat');
 // LOCAL
 const tools = require('../tools');
 
-
 module.exports.concatFiles = (pkg, workingPath, euiVersionNumber = 10) => {
-  return Promise.resolve()
-    .then(() => {
-      tools.logInfo('Concatenating JS files into main.js');
-
-      tools.move(path.join(workingPath, 'main.js'), path.join(workingPath, 'main-old.js'));
+    return Promise.resolve()
+        .then(() => {
 
-      const files = [
-        // covers both webpack and esbuild
-        ...(tools.isFileExists(path.join(workingPath, 'runtime.js')) ? ['runtime.js'] : []),
-        ...(tools.isFileExists(path.join(workingPath, 'polyfills.js')) ? ['polyfills.js'] : []),
-        ...(tools.isFileExists(path.join(workingPath, 'scripts.js')) ? ['scripts.js'] : []),
-        ...(tools.isFileExists(path.join(workingPath, 'vendor.js')) ? ['vendor.js'] : []),
-        'main-old.js',
-      ].map(f => path.join(workingPath, f));
+            tools.logInfo('Concatenating JS files into main.js');
 
-      const outFilePath = path.join(workingPath, 'main.js');
+            tools.move(path.join(workingPath, 'main.js'), path.join(workingPath, 'main-old.js'));
 
-      console.log(files);
+            const files = [
+                // covers both webpack and esbuild
+                ...(tools.isFileExists(path.join(workingPath, 'runtime.js')) ? ['runtime.js'] : []),
+                ...(tools.isFileExists(path.join(workingPath, 'polyfills.js')) ? ['polyfills.js'] : []),
+                ...(tools.isFileExists(path.join(workingPath, 'scripts.js')) ? ['scripts.js'] : []),
+                ...(tools.isFileExists(path.join(workingPath, 'vendor.js')) ? ['vendor.js'] : []),
+                'main-old.js',
+            ].map(f => path.join(workingPath, f));
 
-      return concat(files, outFilePath);
-    })
+            const outFilePath = path.join(workingPath, 'main.js');
 
-    .catch((e) => {
-      throw e;
-    })
-}
+            console.log(files);
 
+            return concat(files, outFilePath);
+        })
 
-module.exports.copyPackageJson = (srcPath, destPath, euiVersion) => {
-  return Promise.resolve()
-    .then(() => {
-      tools.logInfo('Copying package.json to dist');
+        .catch((e) => {
+            throw e;
+        });
+};
 
-      tools.copy(path.join(srcPath, 'package.json'), path.join(destPath, 'package.json'));
+module.exports.createEntryJsFile = (pkg, workingPath, euiVersionNumber = 15) => {
+    return Promise.resolve()
+        .then(() => {
 
-      if (euiVersion) {
-        const packageJsonFile = path.join(destPath, 'package.json');
-        const packageJson = require(packageJsonFile);
+            tools.logInfo('Importing files into entry.js');
 
-        packageJson.euiVersion = euiVersion;
+            const files = [
+                // covers both webpack and esbuild
+                ...(tools.isFileExists(path.join(workingPath, 'runtime.js')) ? ['runtime.js'] : []),
+                ...(tools.isFileExists(path.join(workingPath, 'polyfills.js')) ? ['polyfills.js'] : []),
+                ...(tools.isFileExists(path.join(workingPath, 'scripts.js')) ? ['scripts.js'] : []),
+                ...(tools.isFileExists(path.join(workingPath, 'vendor.js')) ? ['vendor.js'] : []),
+                ...(tools.isFileExists(path.join(workingPath, 'main.js')) ? ['main.js'] : []),
+            ];
 
-        tools.writeJsonFileSync(packageJsonFile, packageJson);
-      }
-    })
+            const outFilePath = path.join(workingPath, 'entry.js');
 
-    .catch((e) => {
-      throw e;
-    })
-}
+            console.log(files);
 
+            let content = ``;
+            files.forEach(f => content = `${content}\nimport \'./${f}\';`.trim());
 
-module.exports.emptyIndexHtml = (pkg, destPath) => {
-  return Promise.resolve()
-    .then(() => {
-      try {
-        if (pkg.build.injectPiwikScript) {
-          tools.logInfo('Inject index.html with piwik script embedded');
+            return tools.writeFileContent(outFilePath, content);
+        })
 
-          const emptyIndexHtmlFile = path.join(__dirname, 'skeletons', 'elements', 'index-piwik.html');
-          const outputIndexHmtlFile = path.join(destPath, 'index.html');
-          return tools.copy(emptyIndexHtmlFile, outputIndexHmtlFile);
+        .catch((e) => {
+            throw e;
+        });
+};
 
-        } else {
-          tools.logInfo('Set empty index.html');
+module.exports.copyPackageJson = (pkg, srcPath, destPath, euiVersion, entryName) => {
+    return Promise.resolve()
+        .then(() => {
+            tools.logInfo('Copying package.json to dist');
 
-          const emptyIndexHtmlFile = path.join(__dirname, 'skeletons', 'elements', 'index.html');
-          const outputIndexHmtlFile = path.join(destPath, 'index.html');
-          return tools.copy(emptyIndexHtmlFile, outputIndexHmtlFile);
-        }
+            tools.copy(path.join(srcPath, 'package.json'), path.join(destPath, 'package.json'));
 
-      } catch(e) {
-        console.log(e);
-      }
-    })
+            if (euiVersion || entryName) {
+                const packageJsonFile = path.join(destPath, 'package.json');
+                const packageJson = require(packageJsonFile);
 
-    .catch((e) => {
-      throw e;
-    })
-}
+                packageJson.euiVersion = euiVersion;
+                packageJson.entryName = entryName;
 
+                tools.writeJsonFileSync(packageJsonFile, packageJson);
+            }
+        })
 
-module.exports.cleanupUnusedAssets = (assetsPath, euiVersionNumber = 10) => {
-  tools.logInfo(`Cleanup unused assets for version : ${euiVersionNumber} in ${assetsPath}`);
+        .catch((e) => {
+            throw e;
+        });
+};
 
-  if (euiVersionNumber > 10) {
 
+module.exports.emptyIndexHtml = (pkg, destPath) => {
     return Promise.resolve()
-    .then(() => {
-      return tools.rimraf(path.join(assetsPath, 'ecl'));
-    })
-    .then(() => {
-      return tools.rimraf(path.join(assetsPath, 'icons', 'ionicons'));
-    })
-    .then(() => {
-      return tools.rimraf(path.join(assetsPath, 'icons', 'svg'));
-    })
-    .then(() => {
-      return tools.rimraf(path.join(assetsPath, 'icons', 'svg-src'));
-    })
-    .then(() => {
-      return tools.rimraf(path.join(assetsPath, 'icons', 'flags'));
-    })
-    .then(() => {
-      return tools.rimraf(path.join(assetsPath, 'fonts'));
-    })
-    .then(() => {
-      return tools.rimraf(path.join(assetsPath, 'i18n-eui'));
-    })
-
-    .catch((e) => {
-      throw e;
-    })
-  }
-}
+        .then(() => {
+            try {
+                if (pkg.build.injectPiwikScript) {
+                    tools.logInfo('Inject index.html with piwik script embedded');
+
+                    const emptyIndexHtmlFile = path.join(__dirname, 'skeletons', 'elements', 'index-piwik.html');
+                    const outputIndexHmtlFile = path.join(destPath, 'index.html');
+                    return tools.copy(emptyIndexHtmlFile, outputIndexHmtlFile);
+
+                } else {
+                    tools.logInfo('Set empty index.html');
+
+                    const emptyIndexHtmlFile = path.join(__dirname, 'skeletons', 'elements', 'index.html');
+                    const outputIndexHmtlFile = path.join(destPath, 'index.html');
+                    return tools.copy(emptyIndexHtmlFile, outputIndexHmtlFile);
+                }
+
+            } catch (e) {
+                console.log(e);
+            }
+        })
+
+        .catch((e) => {
+            throw e;
+        });
+};
+
+
+module.exports.cleanupUnusedAssets = (assetsPath, euiVersionNumber = 10) => {
+    tools.logInfo(`Cleanup unused assets for version : ${euiVersionNumber} in ${assetsPath}`);
+
+    if (euiVersionNumber > 10) {
+
+        return Promise.resolve()
+            .then(() => {
+                return tools.rimraf(path.join(assetsPath, 'ecl'));
+            })
+            .then(() => {
+                return tools.rimraf(path.join(assetsPath, 'icons', 'ionicons'));
+            })
+            .then(() => {
+                return tools.rimraf(path.join(assetsPath, 'icons', 'svg'));
+            })
+            .then(() => {
+                return tools.rimraf(path.join(assetsPath, 'icons', 'svg-src'));
+            })
+            .then(() => {
+                return tools.rimraf(path.join(assetsPath, 'icons', 'flags'));
+            })
+            .then(() => {
+                return tools.rimraf(path.join(assetsPath, 'fonts'));
+            })
+            .then(() => {
+                return tools.rimraf(path.join(assetsPath, 'i18n-eui'));
+            })
+
+            .catch((e) => {
+                throw e;
+            });
+    }
+};

package/scripts/utils/serve/element.js

@@ -1,7 +1,6 @@
 'use strict';
 
 const path = require('path');
-const execa = require('execa');
 
 const tools = require('../tools');
 const remotesUtils = require('../remotes/remotes-utils');
@@ -98,11 +97,35 @@ module.exports.serve = (remote = false) => {
     })
 
     .then(() => {
-      return remotesUtils.concatFiles(pkg, destPath, euiVersionNumber);
+      // remove browser folder for esbuild builds
+      const isEsbuild = pkg?.build?.esbuild !== undefined ?? false;
+
+      if (isEsbuild) {
+        tools.copydirFiles(path.join(destPath, 'browser'), path.join(destPath));
+        tools.remove(path.join(destPath, 'browser'));
+        return Promise.resolve();
+      } else {
+        Promise.resolve();
+      }
+    })
+
+    .then(() => {
+      // Note: it's limited to 18, but it could be applied to 15 / 16 / 17 / 18
+      const loadedAsJsModule = euiVersionNumber >= 18;
+
+      if (loadedAsJsModule) {
+        return remotesUtils.createEntryJsFile(pkg, destPath, euiVersionNumber);
+      } else {
+        return remotesUtils.concatFiles(pkg, destPath, euiVersionNumber);
+      }
     })
 
     .then(() => {
-      return remotesUtils.copyPackageJson(pkg.paths.root, rootDestPath, remoteEuiVersion);
+      // Note: it's limited to 18, but it could be applied to 15 / 16 / 17 / 18
+      const loadedAsJsModule = euiVersionNumber >= 18;
+
+      const name = loadedAsJsModule ? 'entry' : undefined;
+      return remotesUtils.copyPackageJson(pkg, pkg.paths.root, rootDestPath, remoteEuiVersion, name);
     })
 
     .then(() => {
@@ -112,4 +135,4 @@ module.exports.serve = (remote = false) => {
     .catch((e) => {
       throw e;
     });
-}
+};