@zohodesk/client_build_tool 0.0.5 → 0.0.6

package/CHANGELOG.md

@@ -1,5 +1,19 @@
 # Changelog and Release Notes
 
+## v0.0.6 (4-09-2023)
+
+**Feature:-**
+- Generating bundle integrity report json file for the build assets only in production mode. To use this feature we need to add `stats > enable` or cli flags `enable_stats`.
+- Added Resource Cleanup plugin to cleanup resource retained by build tool. this plugin is controlled by efc flag resourcecleanup flag.
+- added support for using regex expression to get group of chunks chunkId via Resource Hint plugin prefetch/preload hook.
+  only will be activate when `resourceHints` => `allowPrefetchingMultipleChunks` as `true`
+- added support for glob pattern for custom chunks split logic.
+- added options to split chunks base config in the key `app` => `customChunksBaseConfig` as object
+
+**Change:-**
+- i18n name not generated issue fix.
+- public path not correctly set issue fix.
+- changing plugin hook stages in i18nRuntimePlugin and sourceMapPlugin
 ## v0.0.5 (6-08-2023)
 
 **Changes:--**

package/README.md

@@ -84,6 +84,20 @@ These commands provide flexibility and control over your client-side build proce
 For more [Details](ConfigurationDocumentation.md)
 # Changelog and Release Notes
 
+## v0.0.6 (4-09-2023)
+
+**Feature:-**
+- Generating bundle integrity report json file for the build assets only in production mode. To use this feature we need to add `stats > enable` or cli flags `enable_stats`.
+- Added Resource Cleanup plugin to cleanup resource retained by build tool. this plugin is controlled by efc flag resourcecleanup flag.
+- added support for using regex expression to get group of chunks chunkId via Resource Hint plugin prefetch/preload hook.
+  only will be activate when `resourceHints` => `allowPrefetchingMultipleChunks` as `true`
+- added support for glob pattern for custom chunks split logic.
+- added options to split chunks base config in the key `app` => `customChunksBaseConfig` as object
+
+**Change:-**
+- i18n name not generated issue fix.
+- public path not correctly set issue fix.
+- changing plugin hook stages in i18nRuntimePlugin and sourceMapPlugin
 ## v0.0.5 (6-08-2023)
 
 **Changes:--**

package/lib/commands/build/optionsProcessor.js

@@ -21,13 +21,13 @@ function optionsProcessor(options) {
     isCdnEnabled
   } = options.cdnMapping;
   const serverExtras = (0, _decidePublicPath.modifiedServerOptions)(options);
-  const publicPath = noPublicPath ? '' : (0, _decidePublicPath.decidePublicPath)(serverExtras);
+  const publicPath = noPublicPath ? undefined : (0, _decidePublicPath.decidePublicPath)(serverExtras);
   const contextFolderPath = (0, _constants.joinWithAppPath)(context);
   const defaultAppliedOptions = { ...options,
     serverExtras,
     // eslint-disable-next-line no-nested-ternary
     mode: mode === null ? 'prod' : mode === 'dev' ? 'dev' : 'prod',
-    publicPath: (0, _modeUtils.isDevelopmentMode)(mode) || isCdnEnabled ? '' : publicPath,
+    publicPath: (0, _modeUtils.isDevelopmentMode)(mode) || isCdnEnabled ? undefined : publicPath,
     contextFolderPath,
     httpsOptions: serverExtras.httpsOptions
   };

package/lib/commands/start/optionsProcessor.js

@@ -16,7 +16,7 @@ function optionsProcessor(options) {
     noPublicPath
   } = options;
   const serverExtras = (0, _decidePublicPath.modifiedServerOptions)(options);
-  const publicPath = noPublicPath ? '' : (0, _decidePublicPath.decidePublicPath)(serverExtras);
+  const publicPath = noPublicPath ? undefined : (0, _decidePublicPath.decidePublicPath)(serverExtras);
   const contextFolderPath = (0, _constants.joinWithAppPath)(context);
   const defaultAppliedOptions = { ...options,
     // eslint-disable-next-line no-nested-ternary

package/lib/schemas/defaultConfigValues.js

@@ -15,6 +15,16 @@ var _default = {
   },
   devtool: 'source-map',
   statsLogConfig: null,
+  stats: {
+    enable: {
+      value: false,
+      cli: 'enable_stats',
+      type: 'boolean'
+    },
+    fileName: null,
+    options: null,
+    excludeKeys: null
+  },
   enableFileNameHashing: {
     value: false,
     cli: 'enable_hash'
@@ -210,6 +220,11 @@ var _default = {
     outputFile: {
       value: 'efc-sdk-[version].js',
       cli: 'efc_output'
+    },
+    resourceCleanup: {
+      value: false,
+      cli: 'enable_efc_resource_cleanup',
+      type: 'boolean'
     }
   },
   createSeparateSMap: {

package/lib/schemas/defaultConfigValuesOnly.js

@@ -119,7 +119,8 @@ var _default = {
     version: 'v1',
     createSDkFile: false,
     templateFilePath: 'efcTemplate.js',
-    outputFile: 'efc-sdk-[version].js'
+    outputFile: 'efc-sdk-[version].js',
+    resourceCleanup: false
   },
   createSeparateSMap: false,
   babelCustomizations: {
@@ -175,6 +176,12 @@ var _default = {
     templateFilePath: 'sw.js',
     outputFilePath: '/v1.js',
     replaceText: '//<!--AssetsFromBuild -->'
+  },
+  stats: {
+    enable: false,
+    fileName: null,
+    options: null,
+    excludeKeys: null
   }
 };
 exports.default = _default;

package/lib/shared/bundler/webpack/common/modeUtils.js

@@ -3,6 +3,7 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
+exports.getGlobalCacheStorageName = getGlobalCacheStorageName;
 exports.getWebpackMode = getWebpackMode;
 exports.isDevelopmentMode = isDevelopmentMode;
 exports.isNotProduction = isNotProduction;
@@ -23,6 +24,13 @@ function getWebpackMode(options) {
   return isProductionMode(mode) ? 'production' : 'development';
 }
 
+function getGlobalCacheStorageName(options) {
+  const {
+    context
+  } = options;
+  return `${context}Jsonp`;
+}
+
 function isNotProduction(options) {
   const {
     mode

package/lib/shared/bundler/webpack/custom_plugins/BundleIntegrityReport/index.js

@@ -0,0 +1,83 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.BundleIntegrityReport = void 0;
+
+var _fs = _interopRequireDefault(require("fs"));
+
+var _path = _interopRequireDefault(require("path"));
+
+var _stream = require("stream");
+
+var _objectManipulation = require("../../utils/object-manipulation");
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+const pluginName = 'BundleIntegrityReportPlugin';
+
+class BundleIntegrityReport {
+  constructor({
+    options,
+    excludeKeysInReport,
+    fileName
+  }) {
+    this.excludeKeysInStat = excludeKeysInReport;
+    this.statsFileName = fileName;
+    this.statsOptions = options;
+  }
+
+  apply(compiler) {
+    compiler.hooks.done.tapAsync(pluginName, (stats, callback) => {
+      const statsJson = (0, _objectManipulation.removeKeysFromObject)(stats.toJson(this.statsOptions), this.excludeKeysInStat);
+      this.emitStats(statsJson).on('end', () => {
+        callback();
+      }).on('error', e => {
+        callback(e);
+      });
+    });
+  }
+
+  writeStatsFileInAStream(statsObj) {
+    const {
+      outputPath
+    } = statsObj;
+
+    const ouputFileName = _path.default.join(outputPath, this.statsFileName);
+
+    return this.createReadStream(statsObj).pipe(_fs.default.createWriteStream(ouputFileName));
+  }
+
+  createReadStream(statsObj) {
+    const excludeKeys = this.excludeKeysInStat;
+    return new _stream.Readable({
+      read() {
+        let isDone = false;
+        const objToStringGen = (0, _objectManipulation.convertObjectToStringGen)(statsObj, excludeKeys);
+
+        while (!isDone) {
+          const {
+            done,
+            value
+          } = objToStringGen.next();
+
+          if (done) {
+            isDone = true;
+            this.push(null);
+          } else {
+            this.push(value);
+          }
+        }
+      }
+
+    });
+  }
+
+  emitStats(statsJson) {
+    return this.writeStatsFileInAStream(statsJson);
+  }
+
+}
+
+exports.BundleIntegrityReport = BundleIntegrityReport;

package/lib/shared/bundler/webpack/custom_plugins/I18nSplitPlugin/I18nFilesEmitPlugin.js

@@ -136,6 +136,8 @@ class I18nFilesEmitPlugin {
     const fileName = fileNameTemplate.replaceAll('[locale]', locale);
     const filename = (0, _pathCreator.pathCreator)(fileName, compilation, {
       hash: compilation.hash,
+      locale,
+      chunkName: chunk.name,
       chunkId: chunk.id,
       chunkHash: chunk.hash,
       contentHash

package/lib/shared/bundler/webpack/custom_plugins/ResourceHintsPlugin.js

@@ -45,14 +45,13 @@ class ResourceHintsPlugin {
         }
 
         enabledChunks.add(entryRuntimeChunk);
-        set.add(_webpack.RuntimeGlobals.getFullHash);
-        set.add(_webpack.RuntimeGlobals.getChunkCssFilename);
+        set.add(_webpack.RuntimeGlobals.getFullHash); // set.add(RuntimeGlobals.getChunkCssFilename);
+
         const {
           publicPathsTemplateObj
         } = this;
         compilation.addRuntimeModule(entryRuntimeChunk, // eslint-disable-next-line no-use-before-define
-        new ResourceHintsRuntimePlugin(set, {
-          compiler,
+        new ResourceHintsRuntimePlugin(compiler, {
           chunk: entryRuntimeChunk,
           allowPrefetchingMultipleChunks: this.allowPrefetchingMultipleChunks,
           publicPathsTemplateObj
@@ -95,17 +94,26 @@ class ResourceHintsRuntimePlugin extends _webpack.RuntimeModule {
         needsMap = true;
       }
     });
-    const {
-      js: jsPP = '',
-      css: cssPP = '',
-      i18n: i18nPP = ''
+    let {
+      js: jsPP,
+      css: cssPP,
+      i18n: i18nPP
     } = this.publicPathsTemplateObj;
-    return _webpack.Template.asString([`
-      const preloadedChunks = {};
-      const nameToChunkIdMap = ${JSON.stringify(needsMap ? nameIdMap : {})};
-      const chunkNames = Object.keys(nameToChunkIdMap);
-
-      function createLinkTag(href, rel) {
+    jsPP = jsPP || _webpack.RuntimeGlobals.publicPath;
+    cssPP = cssPP || _webpack.RuntimeGlobals.publicPath;
+    i18nPP = i18nPP || _webpack.RuntimeGlobals.publicPath;
+    /**
+     * naming abbr
+     * ntc -> nameToChunkIdMap
+     * cns -> chunkNames
+     * clt -> createLinkTag
+     * lpp -> loadAsPreloadOrPrefetch
+     */
+
+    return _webpack.Template.asString([`const ntc = ${JSON.stringify(needsMap ? nameIdMap : {})};
+       const cns = Object.keys(ntc);
+
+      function clt(href, rel) {
         let link = document.createElement("link");
         link.href = href;
         link.rel = rel;
@@ -120,26 +128,24 @@ class ResourceHintsRuntimePlugin extends _webpack.RuntimeModule {
         //return !url.includes(".undefined.");
         return url.indexOf(".undefined.") === -1;
       }
-      function loadAsPreloadOrPrefetch(_chunkId, rel) {
+      function lpp(_chunkId, rel) {
         let chunkId = ${_webpack.RuntimeGlobals.require}.getChunkId(_chunkId);
         // ${_webpack.RuntimeGlobals.require}.e(chunkId);
-        if(__webpack_require__.O.j(chunkId) || preloadedChunks[chunkId]) {
-          preloadedChunks[chunkId] = true;
-          // console.log("skipped loadAsPreloadOrPrefetch", _chunkId, chunkId, rel);
+        if(__webpack_require__.O.j(chunkId)) {
           return;
         }
         const jsUrl = ${jsPP} + __webpack_require__.u(chunkId);
         const cssUrl = ${cssPP} + __webpack_require__.miniCssF(chunkId);
-        isValidUrl(jsUrl) && createLinkTag(jsUrl, rel);
-        isValidUrl(cssUrl) && createLinkTag(cssUrl, rel);
+        isValidUrl(jsUrl) && clt(jsUrl, rel);
+        isValidUrl(cssUrl) && clt(cssUrl, rel);
         if(__webpack_require__.miniI18nF) {
           const i18nUrl = ${i18nPP} + __webpack_require__.miniI18nF(chunkId);
-          isValidUrl(i18nUrl) && createLinkTag(i18nUrl, rel);
+          isValidUrl(i18nUrl) && clt(i18nUrl, rel);
         }
       }
 
       ${_webpack.RuntimeGlobals.require}.getChunkId = function getChunkId(chunkId) {
-        ${needsMap ? 'chunkId = nameToChunkIdMap[chunkId]||chunkId;' : ''}
+        ${needsMap ? 'chunkId = ntc[chunkId]||chunkId;' : ''}
         return chunkId;
       }
       ${_webpack.RuntimeGlobals.require}.getChunkIds = function getChunkIds(chunkId) {
@@ -147,30 +153,25 @@ class ResourceHintsRuntimePlugin extends _webpack.RuntimeModule {
     this.allowPrefetchingMultipleChunks ? `
             const isRegExAsChunkId = chunkId instanceof RegExp;
             if(isRegExAsChunkId) {
-              return chunkNames.filter(chunkName => chunkId.test(chunkName)).map(chunkName => nameToChunkIdMap[chunkName]);
-            }` : ''}
-        return [${_webpack.RuntimeGlobals.require}.getChunkId(chunkId)];
+              return cns.filter(chunkName => chunkId.test(chunkName)).map(chunkName => ntc[chunkName]);
+            }
+            return [${_webpack.RuntimeGlobals.require}.getChunkId(chunkId)];
+            ` : `return [${_webpack.RuntimeGlobals.require}.getChunkId(chunkId)];`}
       }
       // Prefetch a chunk (${pluginName})
       ${_webpack.RuntimeGlobals.require}.pfc = function prefetchChunk(chunkId) {
-        loadAsPreloadOrPrefetch(chunkId, "prefetch");
-        ${this.allowPrefetchingMultipleChunks ? `
-            let chunkIds = ${_webpack.RuntimeGlobals.require}.getChunkIds(chunkId)
+        ${`
+            let chunkIds = ${_webpack.RuntimeGlobals.require}.getChunkIds(chunkId);
             chunkIds.forEach(idOfAChunk => {
-              // ${_webpack.RuntimeGlobals.require}.e(idOfAChunk);
-              loadAsPreloadOrPrefetch(idOfAChunk, "prefetch");
-            })` : 'loadAsPreloadOrPrefetch(chunkId, "prefetch");'}
+              ${_webpack.RuntimeGlobals.require}.e(idOfAChunk);
+            })`}
       };
 
       // Preload a chunk (${pluginName})
       ${_webpack.RuntimeGlobals.require}.plc = function preloadChunk(chunkId) {
-        ${this.allowPrefetchingMultipleChunks ? `
-            let chunkIds = ${_webpack.RuntimeGlobals.require}.getChunkIds(chunkId)
-            chunkIds.forEach(idOfAChunk => {
-              // ${_webpack.RuntimeGlobals.require}.e(idOfAChunk);
-              loadAsPreloadOrPrefetch(idOfAChunk, "preload");
-            })` : 'loadAsPreloadOrPrefetch(chunkId, "preload");'}
-      };
+            let idOfAChunk = ${_webpack.RuntimeGlobals.require}.getChunkIds(chunkId)[0];
+            lpp(idOfAChunk, "preload");
+        }
         ` // `// Prefetch a chunk (${pluginName})`,
     // `${RuntimeGlobals.require}.pfc = function prefetchChunk(chunkId) {`,
     // Template.indent([

package/lib/shared/bundler/webpack/custom_plugins/RuntimeResourceCleanup/index.js

@@ -0,0 +1,73 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+var _webpack = require("webpack");
+
+const pluginName = 'RuntimeResourceCleanupPlugin';
+
+class RuntimeResourceCleanup {
+  constructor({
+    enable: scriptCleanUpEnabled,
+    chunkLoadingGlobal,
+    ...options
+  }) {
+    this.options = options;
+    this.scriptCleanUpEnabled = scriptCleanUpEnabled;
+    this.chunkLoadingGlobal = chunkLoadingGlobal;
+  }
+
+  apply(compiler) {
+    compiler.hooks.compilation.tap(pluginName, compilation => {
+      compilation.hooks.processAssets.tap({
+        name: pluginName,
+        stage: _webpack.Compilation.PROCESS_ASSETS_STAGE_ADDITIONS
+      }, assets => {
+        const runtimeFiles = Object.keys(assets).filter(assetName => /.+?runtime.*\.js$/.test(assetName));
+        const searchString = 'chunkLoadingGlobal.forEach';
+
+        function generateScriptCleanUpCode(attributes) {
+          const [[attributeKey, attributeValue]] = Object.entries(attributes);
+          const selectorForGettingResources = `[${attributeKey}="${attributeValue}"]`;
+          return `
+            document.querySelectorAll('${selectorForGettingResources}').forEach(resource => resource.remove());
+            `;
+        }
+
+        function generateRunTimeObjectCleanupCode() {
+          return `
+                    Object.keys(__webpack_modules__).forEach(moduleKey => __webpack_modules__[moduleKey] = null);
+                    Object.keys(__webpack_module_cache__).forEach(moduleCacheKey => __webpack_module_cache__[moduleCacheKey] = null);
+                    __webpack_modules__ = null; 
+                    __webpack_module_cache__ = null;
+                    Object.keys(__webpack_require__).forEach(staticMethodsKey => __webpack_require__[staticMethodsKey] = null);
+                    __webpack_require__ = null;
+                    `;
+        }
+
+        function attachUninstallMethodToChunkGlobal() {
+          const {
+            chunkLoadingGlobal
+          } = this;
+          return `self['${chunkLoadingGlobal}'].unInstall = function() {
+              ${generateRunTimeObjectCleanupCode()};
+              ${this.scriptCleanUpEnabled ? generateScriptCleanUpCode(this.options.attributes) : ''}
+            }`;
+        }
+
+        runtimeFiles.forEach(runtTimeFile => {
+          const runTimeSource = assets[runtTimeFile].source();
+          const newRunTimeCode = runTimeSource.replace(searchString, `${attachUninstallMethodToChunkGlobal.call(this)};${searchString}`);
+          const newRunTimeResource = new compiler.webpack.sources.RawSource(newRunTimeCode);
+          compilation.updateAsset(runtTimeFile, newRunTimeResource);
+        });
+      });
+    });
+  }
+
+}
+
+exports.default = RuntimeResourceCleanup;

package/lib/shared/bundler/webpack/custom_plugins/SourceMapPlugin/index.js

@@ -8,7 +8,20 @@ exports.SourceMapPlugin = void 0;
 var _webpack = require("webpack");
 
 /* eslint-disable class-methods-use-this */
-const pluginName = 'SplitSourceMapPlugin';
+function checkSmapFilePattern(assetName) {
+  return /\.js$/.test(assetName) && !/\.i18n\.js$/.test(assetName) || /\.js\.map$/.test(assetName) && !/\.i18n\.js\.map$/.test(assetName);
+}
+
+function skipRuntimeFiles(assetName) {
+  return !assetName.includes('runtime') || !assetName.includes('[locale]');
+}
+
+const pluginName = 'SplitSourceMapPlugin'; // Purpose:
+
+/**
+ * we want build that can load files source map and without sourcemap at the same time,
+ * or can be mentioned as so single build need to support two different clients that one for fast load and one for debugging.
+ */
 
 class SourceMapPlugin {
   apply(compiler) {
@@ -23,7 +36,7 @@ class SourceMapPlugin {
         Object.keys(assets).forEach(assetName => {
           const assetCode = assets[assetName].source();
 
-          if (/\.js$/.test(assetName) && !/\.i18n\.js$/.test(assetName) || /\.js\.map$/.test(assetName) && !/\.i18n\.js\.map$/.test(assetName)) {
+          if (checkSmapFilePattern(assetName) && skipRuntimeFiles(assetName)) {
             compilation.renameAsset(assetName, `smap/${assetName}`);
 
             if (!/\.map$/.test(assetName)) {

package/lib/shared/bundler/webpack/outputConfig.js

@@ -11,19 +11,20 @@ var _constants = require("../../constants");
 
 var _nameTemplates = require("./common/nameTemplates");
 
+var _modeUtils = require("./common/modeUtils");
+
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
 function outputConfig(options) {
   const {
     output,
     publicPath,
-    htmlTemplate,
-    context
+    htmlTemplate
   } = options;
   const outputO = {
     filename: (0, _nameTemplates.nameTemplates)('js', options),
     chunkFilename: (0, _nameTemplates.nameTemplates)('chunkjs', options),
-    chunkLoadingGlobal: `${context}Jsonp`,
+    chunkLoadingGlobal: (0, _modeUtils.getGlobalCacheStorageName)(options),
     publicPath,
     // clean: true,
     path: _path.default.resolve(_constants.appPath, output)

package/lib/shared/bundler/webpack/pluginConfigs/configBundleAnalyzer.js

@@ -25,16 +25,16 @@ function configBundleAnalyzer(options) {
 function getBundleAnalyzerOptions(options) {
   return {
     analyzerMode: 'static',
-    generateStatsFile: true,
-    openAnalyzer: false,
-    statsOptions: {
-      source: false,
-      normal: true,
-      chunks: false,
-      chunkGroups: false,
-      module: false,
-      assets: true,
-      assetsSort: 'name'
-    }
+    // generateStatsFile: false,
+    openAnalyzer: false // statsOptions: {
+    //   source: false,
+    //   normal: true,
+    //   chunks: false,
+    //   chunkGroups: false,
+    //   module: false,
+    //   assets: true,
+    //   assetsSort: 'name'
+    // }
+
   };
 }

package/lib/shared/bundler/webpack/pluginConfigs/configBundleIntegrityReport.js

@@ -0,0 +1,36 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.configBundleIntegrityReport = configBundleIntegrityReport;
+
+var _modeUtils = require("../common/modeUtils");
+
+var _BundleIntegrityReport = require("../custom_plugins/BundleIntegrityReport");
+
+function configBundleIntegrityReport(options) {
+  const webpackMode = (0, _modeUtils.getWebpackMode)(options);
+  const isProduction = (0, _modeUtils.isProductionMode)(webpackMode);
+  const {
+    enable: statsEnable
+  } = options.stats;
+
+  if (isProduction && statsEnable) {
+    return new _BundleIntegrityReport.BundleIntegrityReport({
+      fileName: options.stats.fileName || 'bundle-report-integrity.json',
+      excludeKeysInReport: options.stats.excludeKeys || [],
+      options: {
+        preset: 'verbose',
+        ...options.stats.options,
+        assets: true,
+        chunks: true,
+        modules: true,
+        builtAt: true,
+        hash: true
+      }
+    });
+  }
+
+  return null;
+}

package/lib/shared/bundler/webpack/pluginConfigs/configRuntimeResourceCleanup.js

@@ -0,0 +1,31 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.configRuntimeResourceCleanup = configRuntimeResourceCleanup;
+
+var _modeUtils = require("../common/modeUtils");
+
+var _RuntimeResourceCleanup = _interopRequireDefault(require("../custom_plugins/RuntimeResourceCleanup"));
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+function configRuntimeResourceCleanup(options) {
+  const chunkLoadingGlobal = (0, _modeUtils.getGlobalCacheStorageName)(options);
+  const {
+    resourceCleanup: runtimeResourceCleanupEnabled,
+    hasEFC: efcEnabled
+  } = options.efc;
+  const {
+    customAttributes = {}
+  } = options;
+
+  if (efcEnabled && runtimeResourceCleanupEnabled) {
+    return new _RuntimeResourceCleanup.default({ ...customAttributes,
+      chunkLoadingGlobal
+    });
+  }
+
+  return null;
+}

package/lib/shared/bundler/webpack/plugins.js

@@ -43,10 +43,14 @@ var _configTPHashMappingPlugin = require("./pluginConfigs/configTPHashMappingPlu
 
 var _configCustomAttributesPlugin = require("./pluginConfigs/configCustomAttributesPlugin");
 
+var _configBundleIntegrityReport = require("./pluginConfigs/configBundleIntegrityReport");
+
+var _configRuntimeResourceCleanup = require("./pluginConfigs/configRuntimeResourceCleanup");
+
 // import { IgnorePlugin } from 'webpack';
 function plugins(options) {
   const {
     webpackPlugins
   } = options;
-  return [(0, _configEnvVariables.configEnvVariables)(options), (0, _configCustomAttributesPlugin.configCustomAttributesPlugin)(options), (0, _configTPHashMappingPlugin.configTPHashMappingPlugin)(options), (0, _configCopyPublicFolders.configCopyPublicFolders)(options), (0, _configIgnorePlugin.configIgnorePlugin)(options), (0, _configMiniCSSExtractPlugin.configMiniCSSExtractPlugin)(options), (0, _configSelectorWeightPlugin.configSelectorWeightPlugin)(options), (0, _configVariableConversionPlugin.configVariableConversionPlugin)(options), (0, _configI18nSplitPlugin.configI18nSplitPlugin)(options), (0, _configRtlCssPlugin.configRtlCssPlugin)(options), (0, _configHtmlWebpackPlugin.configHtmlWebpackPlugin)(options), (0, _configCdnChangePlugin.configCdnChangePlugin)(options), (0, _configServiceWorkerPlugin.configServiceWorkerPlugin)(options), (0, _configEFCTemplatePlugin.configEFCTemplatePlugin)(options), (0, _configResourceHintsPlugin.configResourceHintsPlugin)(options), (0, _configBundleAnalyzer.configBundleAnalyzer)(options), (0, _configManifestJsonPlugin.configManifestJsonPlugin)(options), (0, _configSourceMapPlugin.configSourceMapPlugin)(options), (0, _configProgressPlugin.configProgressPlugin)(options), ...webpackPlugins].filter(Boolean);
+  return [(0, _configEnvVariables.configEnvVariables)(options), (0, _configCustomAttributesPlugin.configCustomAttributesPlugin)(options), (0, _configTPHashMappingPlugin.configTPHashMappingPlugin)(options), (0, _configCopyPublicFolders.configCopyPublicFolders)(options), (0, _configIgnorePlugin.configIgnorePlugin)(options), (0, _configMiniCSSExtractPlugin.configMiniCSSExtractPlugin)(options), (0, _configSelectorWeightPlugin.configSelectorWeightPlugin)(options), (0, _configVariableConversionPlugin.configVariableConversionPlugin)(options), (0, _configI18nSplitPlugin.configI18nSplitPlugin)(options), (0, _configRtlCssPlugin.configRtlCssPlugin)(options), (0, _configHtmlWebpackPlugin.configHtmlWebpackPlugin)(options), (0, _configCdnChangePlugin.configCdnChangePlugin)(options), (0, _configServiceWorkerPlugin.configServiceWorkerPlugin)(options), (0, _configEFCTemplatePlugin.configEFCTemplatePlugin)(options), (0, _configResourceHintsPlugin.configResourceHintsPlugin)(options), (0, _configBundleAnalyzer.configBundleAnalyzer)(options), (0, _configManifestJsonPlugin.configManifestJsonPlugin)(options), (0, _configSourceMapPlugin.configSourceMapPlugin)(options), (0, _configProgressPlugin.configProgressPlugin)(options), (0, _configBundleIntegrityReport.configBundleIntegrityReport)(options), (0, _configRuntimeResourceCleanup.configRuntimeResourceCleanup)(options), ...webpackPlugins].filter(Boolean);
 }

package/lib/shared/bundler/webpack/splitChunksConfig.js

@@ -36,17 +36,14 @@ function splitChunksConfig(options) {
       minChunks: 1,
       test: isReact,
       enforce: true,
-      // priority: 10
-      priority: 0
+      priority: 30
     },
     vendor: {
       name: 'vendor',
       chunks: 'all',
-      // chunks: 'initial',
       minChunks: 1,
       test: isVendor,
-      // priority: 19,
-      priority: 0
+      priority: 20
     }
   };
   const customChunksConfig = {};
@@ -56,16 +53,17 @@ function splitChunksConfig(options) {
     const obj = getCacheGroup(cacheGroupObj, index);
     customChunksConfig[cacheGroupName] = obj;
   });
-  return {
+  const splitChunksConfig = {
     minSize: 12000,
     ...(customChunksBaseConfig || {}),
     cacheGroups: {
       default: false,
-      vendors: false,
+      defaultVendors: false,
       ...defaultChunks,
       ...customChunksConfig
     }
   };
+  return splitChunksConfig;
 }
 
 function getCacheGroup(obj, index) {
@@ -75,16 +73,17 @@ function getCacheGroup(obj, index) {
     chunks = 'all'
   } = obj;
   const {
+    name,
     patterns,
     enforce,
     minSize,
     maxSize,
     reuseExistingChunk,
-    name
+    automaticNameDelimiter
   } = obj;
+  chunks = obj.chunks || 'all';
   minChunks = obj.minChunks || 2;
   priority = obj.priority || 10 * (index + 2);
-  chunks = obj.chunks || 'all';
   const cacheGroup = {
     name,
     test: m => {
@@ -92,9 +91,9 @@ function getCacheGroup(obj, index) {
       return userRequest && (0, _checkIsPatternsMatchFilename.checkIsPatternsMatchFilename)(patterns, userRequest);
     },
     chunks,
-    enforce,
     minChunks,
-    priority
+    priority,
+    enforce
   };
 
   if (minSize !== undefined) {
@@ -109,5 +108,9 @@ function getCacheGroup(obj, index) {
     cacheGroup.reuseExistingChunk = reuseExistingChunk;
   }
 
+  if (automaticNameDelimiter !== undefined) {
+    cacheGroup.automaticNameDelimiter = automaticNameDelimiter;
+  }
+
   return cacheGroup;
 }

package/lib/shared/bundler/webpack/utils/object-manipulation.js

@@ -0,0 +1,87 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.convertObjectToStringGen = convertObjectToStringGen;
+exports.removeKeysFromObject = removeKeysFromObject;
+
+/* eslint-disable no-restricted-syntax */
+function objectPathMatcher(currentKey, objHierarchy = [], keysToBeRemoved = []) {
+  const objPathKey = objHierarchy.length > 0 ? `${objHierarchy.join('.')}.${currentKey}` : currentKey;
+  return keysToBeRemoved.some(key => {
+    const isWildPath = /^\*/.test(key);
+
+    if (isWildPath) {
+      const newKey = key.replace(/\*\.?/, '');
+      return objPathKey.includes(newKey);
+    }
+
+    return key === objPathKey;
+  });
+}
+/*
+    1) *.keyTobeRemoved -> means match every object path, this key will be removed
+    2) keyToBeremoved -> means root object key
+    3) nestedPath.keyToBeRemoved -> means only that nested path key
+    4) don't need to account for array iteration, just object key path is enough in the key to be removed.
+*/
+
+
+function removeKeysFromObject(obj, keysToBeRemoved, prevKeys = []) {
+  if (Array.isArray(obj)) {
+    return obj.map(item => removeKeysFromObject(item, keysToBeRemoved, prevKeys));
+  }
+
+  if (obj && typeof obj === 'object') {
+    const filteredKeyObject = {};
+    const ObjectKeys = Object.keys(obj);
+
+    for (const objectKey of ObjectKeys) {
+      const isKeyToBeRemoved = objectPathMatcher(objectKey, prevKeys, keysToBeRemoved);
+
+      if (!isKeyToBeRemoved) {
+        filteredKeyObject[objectKey] = removeKeysFromObject(obj[objectKey], keysToBeRemoved, [...prevKeys, objectKey]);
+      }
+    }
+
+    return filteredKeyObject;
+  }
+
+  return obj;
+}
+
+function* convertObjectToStringGen(obj) {
+  if (typeof obj === 'string' || typeof obj === 'number' || typeof obj === 'boolean' || obj === null) {
+    yield JSON.stringify(obj);
+  } else if (Array.isArray(obj)) {
+    yield '[';
+    let isFirst = true;
+
+    for (let item of obj) {
+      if (item === undefined) {
+        item = null;
+      }
+
+      yield `${isFirst ? '' : ','}`;
+      yield* convertObjectToStringGen(item);
+      isFirst = false;
+    }
+
+    yield ']';
+  } else {
+    yield '{';
+    let isFirst = true;
+    const entries = Object.entries(obj);
+
+    for (const [itemKey, itemValue] of entries) {
+      if (itemValue !== undefined) {
+        yield `${isFirst ? '' : ','}${JSON.stringify(itemKey)}: `;
+        yield* convertObjectToStringGen(itemValue);
+        isFirst = false;
+      }
+    }
+
+    yield '}';
+  }
+}

package/lib/shared/commands-utils/doBasicRequirementCheck.js

@@ -9,9 +9,9 @@ exports.doBasicRequirementCheck = doBasicRequirementCheck;
 function doBasicRequirementCheck() {
   const majorV = Number(process.version.slice(1, 4));
 
-  if (majorV >= 12 && majorV <= 18) {
+  if (majorV >= 14 && majorV <= 18) {
     return true;
   }
 
-  throw `your node version not compatible with this cli please update node version to 12 - 18, and your current version is ${process.version}`;
+  throw `your node version not compatible with this cli please update node version to 14 - 18, and your current version is ${process.version}`;
 }

package/lib/shared/server/corsHandling.js

@@ -13,6 +13,15 @@ function corsHandling(app, options) {
 
     res.setHeader('Access-Control-Allow-Private-Network', true);
     res.setHeader('Access-Control-Allow-Credentials', true);
+
+    if (req.get('Access-Control-Request-Headers')) {
+      res.setHeader('Access-Control-Allow-Headers', req.get('Access-Control-Request-Headers'));
+    }
+
+    if (req.get('Access-Control-Request-Method')) {
+      res.setHeader('Access-Control-Allow-Methods', req.get('Access-Control-Request-Method'));
+    }
+
     next();
   });
   app.options('/*', (req, res) => {

package/npm-shrinkwrap.json

@@ -1,12 +1,12 @@
 {
   "name": "@zohodesk/client_build_tool",
-  "version": "0.0.2",
+  "version": "0.0.5-exp.3",
   "lockfileVersion": 2,
   "requires": true,
   "packages": {
     "": {
       "name": "@zohodesk/client_build_tool",
-      "version": "0.0.2",
+      "version": "0.0.5-exp.3",
       "license": "ISC",
       "dependencies": {
         "@babel/cli": "7.17.10",

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@zohodesk/client_build_tool",
-  "version": "0.0.5",
+  "version": "0.0.6",
   "description": "A CLI tool to  build  web applications and client libraries",
   "main": "lib/index.js",
   "bin": {
@@ -8,6 +8,7 @@
     "cbt": "cli.js"
   },
   "scripts": {
+    "exp:publish": "npm publish --tag exp",
     "start": "rm -r lib && npm run build -- -w",
     "prepare": "npm run build",
     "build": "babel src --out-dir lib  --copy-files --config-file=./.babelrc",