@zohodesk/react-cli 1.1.22-exp.1 → 1.1.22-exp.3

package/README.md

@@ -59,28 +59,6 @@ Now to run app
    ```
 - The Memory leak issue while downloading i18n and CSS files has been fixed
 
-
-# 1.1.20-exp.1
-
-**Changes**
-
-- Added memory leak fixes for script, links tags
-
-**Feature**
-- Custom Script loading strategy support for initial html script tags.
-
-# 1.1.19-exp.18
-
-**Changes**
-
-- To do further build size optimization by utilizing webpack provided config.
-
-```
-  innerGraph: true,
-  usedExports: true,
-  sideEffects: true
-```
-
 # 1.1.20 (27-5-2024)
 
 **Feature**

package/lib/babel/cmjs-plugins-presets.js

@@ -13,7 +13,8 @@ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { de
 
 const {
   module: {
-    mode
+    mode,
+    alias
   },
   babelCustomizationForLibrary: {
     babelPlugins
@@ -22,8 +23,11 @@ const {
 } = (0, _utils.getOptions)();
 const isProd = mode.toLowerCase() === 'prod';
 const defaultPlugins = [[require.resolve('babel-plugin-transform-define'), isProd ? {
-  __DOCS__: false
-} : {}], require.resolve('@babel/plugin-syntax-dynamic-import')];
+  __DaliasOCS__: false
+} : {}], require.resolve('@babel/plugin-syntax-dynamic-import'), [require.resolve('babel-plugin-module-resolver'), {
+  "root": ["./"],
+  alias
+}]];
 const resolvedPlugins = [];
 babelPlugins.forEach(plugin => {
   resolvedPlugins.push(require.resolve(plugin));

package/lib/babel/es-plugins-presets.js

@@ -24,7 +24,7 @@ const {
 const isProd = mode.toLowerCase() === 'prod';
 const defaultPlugins = [[require.resolve('babel-plugin-transform-define'), isProd ? {
   __DOCS__: false
-} : {}], require.resolve('@babel/plugin-syntax-dynamic-import')];
+} : {}], require.resolve('@babel/plugin-syntax-dynamic-import'), require.resolve('../utils/addModulePathAlias')];
 const resolvedPlugins = [];
 babelPlugins.forEach(plugin => {
   resolvedPlugins.push(require.resolve(plugin));

package/lib/configs/resolvers.js

@@ -21,6 +21,7 @@ function moduleResolver(options) {
     moduleResolvePath,
     disableES5Transpile
   } = options.app;
+  const customAlias = options.app.alias;
   let required = moduleResolvePath && (0, _requireLocalOrGlobal.requireLocal)(moduleResolvePath);
 
   if (!required) {
@@ -32,10 +33,11 @@ function moduleResolver(options) {
   }
 
   const nodeModulesPath = required ? required.nodeModulesPath : _client_packages_group.nodeModulesPath;
+  const totalAlias = Object.assign({}, _libAlias.libAlias, customAlias);
   return {
     extensions: ['.js', '.jsx', '.ts', '.tsx'],
     modules: [nodeModulesPath, _constants.cliNodeModulesPath, 'node_modules'].filter(Boolean),
-    alias: disableES5Transpile ? _libAlias.libAlias : {} // alias: { ...libAlias, ...clientDependenies }
+    alias: disableES5Transpile ? totalAlias : {} // alias: { ...libAlias, ...clientDependenies }
 
   };
 }

package/lib/configs/webpack.prod.config.js

@@ -103,10 +103,7 @@ module.exports = {
     //     exclude: /\/smap/
     //   })
     // ],
-    moduleIds: 'named',
-    usedExports: true,
-    // innerGraph: true, // this property present on webpack 5
-    sideEffects: true
+    moduleIds: 'named'
   },
   stats: {
     children: false,

package/lib/loaders/workerLoader.js

@@ -19,32 +19,32 @@ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { de
 /* import WebWorkerTemplatePlugin from 'webpack/lib/webworker/WebWorkerTemplatePlugin';
 import ExternalsPlugin from 'webpack/lib/ExternalsPlugin'; */
 const schema = {
-  type: 'object',
-  properties: {
-    publicPath: {
-      anyOf: [{
-        type: 'string'
+  'type': 'object',
+  'properties': {
+    'publicPath': {
+      'anyOf': [{
+        'type': 'string'
       }, {
-        instanceof: 'Function'
+        'instanceof': 'Function'
       }]
     },
-    filename: {
-      anyOf: [{
-        type: 'string',
-        minLength: 1
+    'filename': {
+      'anyOf': [{
+        'type': 'string',
+        'minLength': 1
       }, {
-        instanceof: 'Function'
+        'instanceof': 'Function'
       }]
     },
-    chunkFilename: {
-      type: 'string',
-      minLength: 1
+    'chunkFilename': {
+      'type': 'string',
+      'minLength': 1
     },
-    esModule: {
-      type: 'boolean'
+    'esModule': {
+      'type': 'boolean'
     }
   },
-  additionalProperties: false
+  'additionalProperties': false
 }; // eslint-disable-next-line
 
 function loader() {}
@@ -112,40 +112,25 @@ function pitch(request) {
     }
 
     function workerCode() {
-      if (this.workerInstance) {
-        return this.workerInstance;
-      }
-
       let blob;
 
       try {
         blob = new Blob([`importScripts('${this.workerUrl}');`], {
-          type: 'application/javascript'
+          'type': 'application/javascript'
         });
       } catch (e1) {
         throw new Error(e1);
       }
 
-      const url = window.URL || window.webkitURL;
-      const blobUrl = url.createObjectURL(blob);
-      this.workerInstance = new Worker(blobUrl);
-      return this.workerInstance;
+      let url = window.URL || window.webkitURL;
+      let blobUrl = url.createObjectURL(blob);
+      let worker = new Worker(blobUrl);
+      return worker;
     }
 
-    return cb(null, `const workerObj ={\n
-      workerInstance: null, \n
+    return cb(null, `${options.esModule ? 'export default' : 'module.exports ='} {\n
 			workerUrl: __webpack_public_path__ + ${JSON.stringify(entry)}, \n
 			getInstance: ${workerCode} \n
-		};\n
-    workerObj.getInstance();
-    ${options.esModule ? 'export default' : 'module.exports ='} workerObj;
-    `); // return cb(
-    //   null,
-    //   `${options.esModule ? 'export default' : 'module.exports ='} {\n
-    //   workerInstance: null, \n
-    // 	workerUrl: __webpack_public_path__ + ${JSON.stringify(entry)}, \n
-    // 	getInstance: ${workerCode} \n
-    // }`
-    // );
+		}`);
   });
 }

package/lib/pluginUtils/configHtmlWebpackPlugins.js

@@ -13,10 +13,6 @@ var _htmlWebpackInjectAttributesPlugin = _interopRequireDefault(require("html-we
 
 var _common = require("../common");
 
-var _utils = require("../utils");
-
-var _CustomScriptLoadingStrategyPlugin = _interopRequireDefault(require("../plugins/CustomScriptLoadingStrategyPlugin"));
-
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
 const defaultHTMLMiniFyOption = {
@@ -30,47 +26,6 @@ const defaultHTMLMiniFyOption = {
   removeStyleLinkTypeAttributes: true,
   useShortDoctype: true
 };
-const defaultScriptLoadingStrategy = 'defer';
-const allowedScriptLoadingStrategies = ['blocking', 'defer', 'async', 'module'];
-
-function isAllowedScriptLoadingStrategyUsed(scriptLoadingStategey) {
-  return allowedScriptLoadingStrategies.includes(scriptLoadingStategey);
-}
-
-function getScriptLoadingStrategyForStringType(scriptLoadingStategey) {
-  if (isAllowedScriptLoadingStrategyUsed(scriptLoadingStategey)) {
-    return scriptLoadingStategey;
-  }
-
-  return defaultScriptLoadingStrategy;
-}
-
-function getScriptLoadingStrategyForObject(scriptLoadingStategey) {
-  if (Object.keys(scriptLoadingStategey).length === 0) {
-    return defaultScriptLoadingStrategy;
-  }
-
-  const isAllowedScriptLoadingStrategy = Object.keys(scriptLoadingStategey).every(key => isAllowedScriptLoadingStrategyUsed(key));
-
-  if (isAllowedScriptLoadingStrategy) {
-    return Object.assign({}, scriptLoadingStategey);
-  }
-
-  console.warn('un supported script loading strategy used', scriptLoadingStategey);
-  return defaultScriptLoadingStrategy;
-}
-
-function getScriptLoadingStrategy(scriptLoadingStategey) {
-  if ((0, _utils.getTypeOf)(scriptLoadingStategey) === 'string') {
-    return getScriptLoadingStrategyForStringType(scriptLoadingStategey);
-  }
-
-  if ((0, _utils.getTypeOf)(scriptLoadingStategey) === 'object') {
-    return getScriptLoadingStrategyForObject(scriptLoadingStategey);
-  }
-
-  return 'defer';
-}
 
 function configHtmlWebpackPlugins(plugins, {
   enableChunkHash = false,
@@ -78,8 +33,7 @@ function configHtmlWebpackPlugins(plugins, {
   inject,
   crossorigin,
   hasEFC,
-  minify: minifyHtmlOptions = false,
-  customScriptLoadingStrategey = {}
+  minify: minifyHtmlOptions = false
 }) {
   const optionsHtmlWebpack = {
     chunksSortMode: 'none',
@@ -102,14 +56,4 @@ function configHtmlWebpackPlugins(plugins, {
   crossorigin && plugins.push(new _htmlWebpackInjectAttributesPlugin.default({
     crossorigin: 'anonymous'
   }));
-
-  if (customScriptLoadingStrategey.enable) {
-    const currentScriptLoadingStrategy = getScriptLoadingStrategy(customScriptLoadingStrategey.options);
-
-    if ((0, _utils.getTypeOf)(currentScriptLoadingStrategy) === 'object') {
-      plugins.push(new _CustomScriptLoadingStrategyPlugin.default({
-        scriptLoadingStategey: currentScriptLoadingStrategy
-      }));
-    }
-  }
 }

package/lib/pluginUtils/getDevPlugins.js

@@ -62,8 +62,7 @@ const getDevPlugins = (options, publicPath) => {
         mode
       },
       htmlTemplate: {
-        inject,
-        customScriptLoadingStrategey
+        inject
       },
       crossorigin
     },
@@ -169,8 +168,7 @@ const getDevPlugins = (options, publicPath) => {
     minify: false,
     inject,
     crossorigin,
-    hasEFC,
-    customScriptLoadingStrategey
+    hasEFC
   });
 
   if (hasEFC) {

package/lib/pluginUtils/getProdPlugins.js

@@ -80,8 +80,7 @@ const getProdPlugins = (options, publicPath = '') => {
   } = options.app;
   const {
     inject,
-    minify: minifyHtmlOptions,
-    customScriptLoadingStrategey
+    minify: minifyHtmlOptions
   } = htmlTemplate;
   const {
     i18n
@@ -179,7 +178,6 @@ const getProdPlugins = (options, publicPath = '') => {
     folder,
     inject,
     minify: minifyHtmlOptions,
-    customScriptLoadingStrategey,
     crossorigin,
     hasEFC
   });

package/lib/plugins/EventsHandlingPlugin.js

@@ -18,10 +18,10 @@ class EventsHandlingPlugin {
       fn: compilation => {
         compilation.mainTemplate.hooks.requireEnsure.tap('CustomAttributePlugin', source => {
           // const str = attributeSetTemplate(cssAttributes, 'linkTag');
-          const sourceStr = source.replace('linkTag.onerror = function(event) {', 'linkTag.onerror = function(event) { linkTag.onerror = linkTag.onload = null;');
+          const sourceStr = source.replace('linkTag.onerror = function(event) {', 'linkTag.onerror = function(event) { linkTag.onerror = linkTag.onload = null');
           const replacedSourceStr = sourceStr.replace('linkTag.onload = resolve', `linkTag.onload = () =>  { 
-          linkTag.onerror = linkTag.onload = null;
           resolve();
+          linkTag.onerror = linkTag.onload = null
         };`);
           return replacedSourceStr;
         });

package/lib/plugins/I18nSplitPlugin/I18nDownlodLogic.js

@@ -229,8 +229,8 @@ class I18nDownlodLogic {
       }
       var scriptTag = document.createElement("script");
       scriptTag.onload = () =>  { 
-        scriptTag.onerror = scriptTag.onload = null;
         resolve();
+        scriptTag.onerror = scriptTag.onload = null;
       };
       scriptTag.onerror = function(event) {
         scriptTag.onerror = scriptTag.onload = null;

package/lib/schemas/index.js

@@ -125,6 +125,7 @@ var _default = {
     cssDirStatement: null
   },
   app: {
+    alias: null,
     moduleResolvePath: {
       value: '@zohodesk/client_packages_group',
       cli: 'module_resolve_path'
@@ -322,11 +323,7 @@ var _default = {
     },
     htmlTemplate: {
       minify: null,
-      inject: true,
-      customScriptLoadingStrategey: {
-        enable: false,
-        options: null
-      }
+      inject: true
     },
     removePropTypes: false,
     customChunksBaseConfig: null,
@@ -732,7 +729,8 @@ var _default = {
       value: 'prod',
       cli: 'module_mode'
     },
-    disableES5Transpile: true
+    disableES5Transpile: true,
+    alias: null
   },
   stats: {
     enable: {

package/lib/utils/addModulePathAlias.js

@@ -0,0 +1,23 @@
+"use strict";
+
+var _getOptions = _interopRequireDefault(require("./getOptions"));
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+const options = (0, _getOptions.default)();
+const alias = options.app.alias;
+
+module.exports = () => ({
+  visitor: {
+    ImportDeclaration(path) {
+      const source = path.node.source.value;
+      const aliasName = Object.keys(alias);
+      aliasName.forEach(name => {
+        if (source.includes(name)) {
+          path.node.source.value = source.replace(name, alias[name]);
+        }
+      });
+    }
+
+  }
+});

package/lib/utils/index.js

@@ -167,20 +167,6 @@ var _getComponents = _interopRequireDefault(require("./getComponents"));
 
 var _ssTestHack = _interopRequireDefault(require("./ssTestHack"));
 
-var _typeCheck = require("./typeCheck");
-
-Object.keys(_typeCheck).forEach(function (key) {
-  if (key === "default" || key === "__esModule") return;
-  if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
-  if (key in exports && exports[key] === _typeCheck[key]) return;
-  Object.defineProperty(exports, key, {
-    enumerable: true,
-    get: function () {
-      return _typeCheck[key];
-    }
-  });
-});
-
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
 // eslint-disable-next-line no-duplicate-imports