@zohodesk/client_build_tool 0.0.5-exp.4 → 0.0.5-exp.6

package/CHANGELOG.md

@@ -1,9 +1,6 @@
 # Changelog and Release Notes
 
-## v0.0.5-exp.4 (14-09-2023)
-
-**changes:--**
-- changing jsPP,cssPP,i18nPP values in ResourceHintsPlugin
+## v0.0.5-exp.5
 
 ## v0.0.5-exp.3 (11-09-2023)
 

package/README.md

@@ -84,10 +84,7 @@ These commands provide flexibility and control over your client-side build proce
 For more [Details](ConfigurationDocumentation.md)
 # Changelog and Release Notes
 
-## v0.0.5-exp.4 (14-09-2023)
-
-**changes:--**
-- changing jsPP,cssPP,i18nPP values in ResourceHintsPlugin
+## v0.0.5-exp.5
 
 ## v0.0.5-exp.3 (11-09-2023)
 

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 ? null : (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,7 @@ class I18nFilesEmitPlugin {
     const fileName = fileNameTemplate.replaceAll('[locale]', locale);
     const filename = (0, _pathCreator.pathCreator)(fileName, compilation, {
       hash: compilation.hash,
+      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 = _webpack.RuntimeGlobals.publicPath,
-      css: cssPP = _webpack.RuntimeGlobals.publicPath,
-      i18n: i18nPP = _webpack.RuntimeGlobals.publicPath
+    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/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,31 @@
+"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: {
+        all: true,
+        ...options.stats.options
+      }
+    });
+  }
+
+  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;
 }