@zohodesk/client_build_tool 0.0.22-exp.4 → 0.0.22-exp.5

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

@@ -1,160 +0,0 @@
-/* eslint-disable no-restricted-syntax */
-import { sources } from 'webpack';
-import { createHash } from "./createHash";
-import { pathCreator } from "./pathCreator";
-import { jsonToString } from "./utils/propertiesUtils";
-import { getLocaleChunkAssetsStore } from "./LocaleChunkAssetsStore";
-const pluginName = 'I18nFilesEmitPlugin';
-const {
-  RawSource
-} = sources;
-export class I18nFilesEmitPlugin {
-  constructor(options) {
-    this.options = options; // this.options = {
-    //   locales: options.locales,
-    //   chunkFilename: options.chunkFilename,
-    //   filename: options.filename,
-    //   allI18nObject: options.allI18nObject,
-    //   jsonpFunc: options.jsonpFunc
-    // };
-  }
-
-  apply(compiler) {
-    compiler.hooks.thisCompilation.tap(pluginName, compilation => {
-      // Get store for cache
-      this.store = getLocaleChunkAssetsStore(compilation);
-      const i18nStore = this.store;
-      compilation.hooks.beforeHash.tap(pluginName, () => {
-        i18nStore.clear();
-        this.createAndStoreFileContentForEveryChunkAndLocale(compilation);
-      });
-      compilation.hooks.chunkHash.tap(pluginName, (chunk, hash) => {
-        this.updateChunkHashForEveryLocale(chunk, hash);
-      });
-      compilation.hooks.contentHash.tap(pluginName, chunk => {
-        if (!i18nStore.isChunkHasI18n(chunk.id)) {
-          return;
-        }
-
-        this.emitI18nFileForEveryLocale(chunk, compilation);
-      });
-    });
-  }
-
-  createAndStoreFileContentForEveryChunkAndLocale(compilation) {
-    const {
-      chunks
-    } = compilation;
-    const {
-      locales
-    } = this.options;
-    const i18nStore = this.store;
-
-    for (const chunk of chunks) {
-      const i18nKeys = i18nStore.getI18nKeysForChunk(chunk);
-
-      if (!i18nKeys.length) {
-        // eslint-disable-next-line no-continue
-        continue;
-      }
-
-      for (const locale of locales) {
-        const content = this.getI18nChunkFileContent(i18nKeys, locale);
-        i18nStore.storeData(chunk.id, locale, {
-          content
-        });
-      }
-    }
-  }
-
-  updateChunkHashForEveryLocale(chunk, hash) {
-    const {
-      locales
-    } = this.options;
-    const i18nStore = this.store;
-
-    if (i18nStore.isChunkHasI18n(chunk.id)) {
-      for (const loc of locales) {
-        const content = i18nStore.getContent(chunk.id, loc);
-        hash.update(content);
-      }
-    }
-  }
-
-  emitI18nFileForEveryLocale(chunk, compilation) {
-    const i18nStore = this.store;
-    const {
-      locales,
-      chunkFilename,
-      filename
-    } = this.options;
-    const fileNameTemplate = chunk.canBeInitial() ? filename : chunkFilename; // const { chunks } = compilation;
-
-    for (const locale of locales) {
-      const content = i18nStore.getContent(chunk.id, locale);
-      const contentHash = createHash({
-        outputOptions: compilation.outputOptions,
-        content
-      });
-      const {
-        filename
-      } = I18nFilesEmitPlugin.createFilenameWithHash({
-        compilation,
-        contentHash,
-        fileNameTemplate,
-        chunk,
-        locale
-      });
-      i18nStore.storeData(chunk.id, locale, {
-        contentHash,
-        filename
-      });
-      compilation.emitAsset(filename, new RawSource(content));
-    }
-  }
-
-  static createFilenameWithHash(_ref) {
-    let {
-      compilation,
-      fileNameTemplate,
-      chunk,
-      locale,
-      contentHash
-    } = _ref;
-    const fileName = fileNameTemplate.replaceAll('[locale]', locale);
-    const filename = pathCreator(fileName, compilation, {
-      hash: compilation.hash,
-      locale,
-      chunkName: chunk.name,
-      chunkId: chunk.id,
-      chunkHash: chunk.hash,
-      contentHash
-    });
-    return {
-      contentHash,
-      filename
-    };
-  }
-
-  getI18nContentForkeys(i18nKeys, locale) {
-    const {
-      allI18nObject
-    } = this.options;
-    const data = {};
-
-    for (const key of i18nKeys) {
-      data[key] = allI18nObject[locale][key];
-    }
-
-    return data;
-  }
-
-  getI18nChunkFileContent(i18nKeys, loc) {
-    const {
-      jsonpFunc
-    } = this.options;
-    const data = this.getI18nContentForkeys(i18nKeys, loc);
-    return `${jsonpFunc}(${jsonToString(data)})`;
-  }
-
-}

package/es/shared/bundler/webpack/custom_plugins/I18nSplitPlugin/I18nKeysIdentifer.js

@@ -1,66 +0,0 @@
-/* eslint-disable max-classes-per-file */
-import { collectI18nKeysfromAST, collectI18nKeysfromComments } from "./utils";
-import { LocaleChunkAssetsStore, setLocaleChunkAssetsStore } from "./LocaleChunkAssetsStore";
-const pluginName = 'I18nKeysIdentifier';
-/**
- * this plugin search the i18 keys and make it as I18nDependency.
- * how it works?
- *  this plugin get jsResourceI18nKeys in constructor.
- *  we walk thought the js files AST
- *      if any string literal in that AST is in jsResourceI18nKeys then  we consider that string as I18n key
- *  after the walk of AST we get some I18n keys
- *  then we make it as I18nDependency.
- */
-
-export default class I18nKeysIdentifer {
-  constructor(_ref) {
-    let {
-      jsResourceI18nKeys
-    } = _ref;
-    this.jsResourceI18nKeys = jsResourceI18nKeys;
-    this.store = new LocaleChunkAssetsStore();
-  }
-
-  apply(compiler) {
-    // const { splitChunks } = compiler.options.optimization;
-    // if (splitChunks) {
-    //   if (splitChunks.defaultSizeTypes.includes('...')) {
-    //     splitChunks.defaultSizeTypes.push(MODULE_TYPE);
-    //   }
-    // }
-    compiler.hooks.thisCompilation.tap(pluginName, compilation => {
-      this.store.updateCompilation(compilation);
-      setLocaleChunkAssetsStore(compilation, this.store);
-    });
-    compiler.hooks.normalModuleFactory.tap(pluginName, factory => {
-      // handler for parser
-      const handler = parser => {
-        parser.hooks.program.tap(pluginName, (ast, comments) => {
-          const {
-            module
-          } = parser.state; //
-
-          if (!(module && /\.jsx?$/.test(module.resource))) {
-            return;
-          } // i18n grep proper contract regex
-
-
-          let i18nKeys = collectI18nKeysfromAST(ast, this.jsResourceI18nKeys);
-          i18nKeys = i18nKeys.concat( // i18n grep proper contract regex
-          collectI18nKeysfromComments(comments, this.jsResourceI18nKeys));
-
-          if (i18nKeys.length) {
-            // console.log('i18nKeys.length', module.resource, i18nKeys);
-            this.store.updateModuleI18nKeys(module.resource, i18nKeys);
-          }
-        });
-      }; // this below  hook was tapped for collect I18n Key from files and add as Dependency
-      // const factory = params.normalModuleFactory;
-
-
-      factory.hooks.parser.for('javascript/auto').tap(pluginName, handler);
-      factory.hooks.parser.for('javascript/dynamic').tap(pluginName, handler);
-    });
-  }
-
-}

package/es/shared/bundler/webpack/custom_plugins/I18nSplitPlugin/I18nRuntimeDealerPlugin.js

@@ -1,201 +0,0 @@
-import { Compilation, RuntimeGlobals, sources } from 'webpack';
-import HtmlWebpackPlugin from 'html-webpack-plugin';
-import { I18N_CHUNK_NAME_GENERATION_SEGMENT } from "./constants";
-import { getI18nLoadingRuntimeModule } from "./getI18nLoadingRuntimeModule";
-import { templateFileName } from "./templateFileName";
-import { hasContentHash } from "./utils/hashUtils";
-import { urlConcat } from "../../../../server/urlConcat";
-import { I18nFilesEmitPlugin } from "./I18nFilesEmitPlugin";
-import { getLocaleChunkAssetsStore } from "./LocaleChunkAssetsStore";
-import { verboseLogger } from "../../../../../logger";
-const {
-  RawSource
-} = sources;
-const pluginName = 'I18nRuntimeDealerPlugin'; // I18nExtractPlugin.loader = require.resolve('./loader');
-
-export class I18nRuntimeDealerPlugin {
-  constructor(options) {
-    this.options = options;
-  }
-
-  apply(compiler) {
-    compiler.hooks.thisCompilation.tap(pluginName, compilation => {
-      // Get store for cache
-      this.store = getLocaleChunkAssetsStore(compilation);
-
-      if (!this.options.runtime) {
-        return;
-      }
-
-      this.createI18nDownloadCodeInRuntimeFile(compilation);
-      this.addI18nIntoInitialHtml(compilation);
-    });
-  }
-
-  addI18nIntoInitialHtml(compilation) {
-    const i18nStore = this.store;
-    HtmlWebpackPlugin.getHooks(compilation).beforeAssetTagGeneration.tap(pluginName, hookOptions => {
-      const {
-        assets
-      } = hookOptions;
-      const {
-        templateLabel,
-        filename,
-        publicPath = '',
-        mainChunkName
-      } = this.options; // const dummyContent = '// dummy comment';
-
-      const dummyContentHash = 'dummy0content0hashes';
-      const entryPoint = compilation.entrypoints.get(mainChunkName);
-      const initialChunks = Array.from(entryPoint.chunks).filter(c => c.canBeInitial() && c.id !== c.runtime);
-      const initialI18nAssets = initialChunks.filter(c => i18nStore.isChunkHasI18n(c)).map(c => {
-        const data = I18nFilesEmitPlugin.createFilenameWithHash({
-          compilation,
-          fileNameTemplate: filename,
-          chunk: c,
-          locale: templateLabel,
-          // NOTE: we used dummy  content hash.
-          //  Because we have no plan on use in content hash to initial I18n chunks
-          // So Dummy hash was being used it will not work  just skip warnings
-          contentHash: dummyContentHash
-        });
-        return urlConcat(publicPath, data.filename);
-      });
-      const allJSAssets = [...initialI18nAssets, ...assets.js].map(url => url.replaceAll('[locale]', templateLabel).replaceAll('%5Blocale%5D', templateLabel));
-      return {
-        assets: { ...assets,
-          js: allJSAssets
-        }
-      };
-    });
-  }
-
-  createI18nDownloadCodeInRuntimeFile(compilation) {
-    const {
-      chunkFilename,
-      locales,
-      localeVarName
-    } = this.options;
-    const chunkFilenameHasContentHash = hasContentHash(chunkFilename);
-
-    const getI18nChunks = mainChunk => this.filterI18nUsedChunks(mainChunk.getAllAsyncChunks());
-
-    const I18nLoadingRuntimeModule = getI18nLoadingRuntimeModule({
-      getI18nChunks
-    });
-    const enabledChunks = new WeakSet();
-
-    const chunkFilenameUrlGenerator = (i18nChunks, locale) => templateFileName({
-      compilation,
-      localeVarName,
-      dynamicFilename: chunkFilename,
-      contentHashes: this.getContentHashes(locale),
-      chunks: i18nChunks
-    });
-
-    const prefixFunc = () => I18N_CHUNK_NAME_GENERATION_SEGMENT;
-
-    const handler = (entryRuntimeChunk, set) => {
-      if (enabledChunks.has(entryRuntimeChunk)) {
-        return;
-      }
-
-      enabledChunks.add(entryRuntimeChunk);
-      const {
-        chunkFilename,
-        // filename: initialFilename,
-        runtimeOptions
-      } = this.options;
-
-      if (typeof chunkFilename === 'string' && /\[(full)?hash(:\d+)?\]/.test(chunkFilename)) {
-        set.add(RuntimeGlobals.getFullHash);
-      }
-
-      set.add(RuntimeGlobals.publicPath);
-      compilation.addRuntimeModule(entryRuntimeChunk, new I18nLoadingRuntimeModule(set, {
-        prefixFunc: chunkFilenameHasContentHash ? prefixFunc : chunkFilenameUrlGenerator,
-        runtimeOptions,
-        chunkFilename
-      }));
-    };
-
-    compilation.hooks.runtimeRequirementInTree.for(RuntimeGlobals.ensureChunkHandlers).tap(pluginName, handler);
-
-    if (chunkFilenameHasContentHash) {
-      compilation.hooks.processAssets.tap({
-        name: pluginName,
-        stage: Compilation.PROCESS_ASSETS_STAGE_DERIVED // additionalAssets: true
-
-      }, assets => {
-        // eslint-disable-next-line no-underscore-dangle
-        const entries = compilation._getChunkGraphEntries();
-
-        function createRuntimeFilePerLocale(_ref) {
-          let {
-            locale,
-            runtimeFileName,
-            runtimeFileSourceStr,
-            i18nChunks
-          } = _ref;
-          const newRuntimeName = runtimeFileName.replaceAll('[locale]', locale);
-          const replaceText = chunkFilenameUrlGenerator(i18nChunks, locale);
-          const replacedStr = runtimeFileSourceStr.replace(I18N_CHUNK_NAME_GENERATION_SEGMENT, replaceText);
-          compilation.emitAsset(newRuntimeName, new RawSource(replacedStr));
-        } // eslint-disable-next-line no-restricted-syntax
-
-
-        for (const entryChunk of entries) {
-          const i18nChunks = getI18nChunks(entryChunk);
-          const runtimeFileName = [...entryChunk.files][0];
-          const runtimeFileSourceStr = assets[runtimeFileName].source();
-          locales.forEach(locale => createRuntimeFilePerLocale({
-            locale,
-            entryChunk,
-            runtimeFileName,
-            runtimeFileSourceStr,
-            i18nChunks
-          })); // NOTE: we don't delete, Because of HTML plugin needs to add runtime file in html and  efc 
-          // compilation.deleteAsset(runtimeFileName);
-        }
-      });
-      compilation.hooks.processAssets.tap({
-        name: pluginName,
-        stage: Compilation.PROCESS_ASSETS_STAGE_SUMMARIZE // additionalAssets: true
-
-      }, () => {
-        // eslint-disable-next-line no-underscore-dangle
-        const entries = compilation._getChunkGraphEntries(); // eslint-disable-next-line no-restricted-syntax
-
-
-        for (const entryChunk of entries) {
-          const runtimeFileName = [...entryChunk.files][0] || '';
-
-          if (runtimeFileName.includes('runtime') && runtimeFileName.includes('[locale]')) {
-            verboseLogger('deleteAsset', runtimeFileName);
-            compilation.deleteAsset(runtimeFileName);
-          }
-        }
-      });
-    }
-  }
-
-  filterI18nUsedChunks(chunks) {
-    const i18nStore = this.store;
-    return Array.from(chunks).filter(c => i18nStore.isChunkHasI18n(c.id));
-  }
-
-  getContentHashes(locale) {
-    const i18nStore = this.store;
-    const contentHashes = {};
-    i18nStore.forEachChunkId(chunkId => {
-      const contentHash = i18nStore.getContentHash(chunkId, locale);
-
-      if (contentHash) {
-        contentHashes[chunkId] = contentHash;
-      }
-    }); // console.log({ contentHashes });
-
-    return contentHashes;
-  }
-
-}

package/es/shared/bundler/webpack/custom_plugins/I18nSplitPlugin/I18nSplit.md

@@ -1,95 +0,0 @@
-# I18n Split As Chunks Plugin
-
-generaly we have manage our all I18n keys and values as language specific i18n files and then we download all i18n in initial page load.
-
-### what is the problem with this?.
-
-the problem is i18n file keep get's grown it will affect the the inital page load and critial rendering path.
-So, We have decide to create a plugin for split i18n per chunk's of js vise.
-
-### what is i18n split?
-
-it is like code split for i18n.
-we will collect i18n from js chunk and we will create separate i18n chunk per js chunk,  
- with this we already load Js chunks are on demand and now we also download i18n also ondemand with this the initial and forthere actions.  
- when js download's we will download i18n with it.
-
-### How to we going to i18n split?
-
-we will read the js chunk and collect I18n keys form it,  
- then we will create i18n chunk files with these used keys.
-
-### how do you collect i18n keys from js files?
-
-we will traverse the js file's AST (static analysis) and find i18 keys,  
- we will concider all string which is in jsResource file as i18n keys.  
- and you can tell dynamic i18n key by js comments,  
- Like Below:-
-
-```js
-fetch('tickets?view=view1').then(data => {
-  // I18n support.ticketsEmpty
-  // I18n support.viewNotFount
-  // I18n support.permissionDenied
-  let text = getI18nValue(data.i18nkey);
-});
-```
-
-### is there any posiblity for unwanted keys in some chunk?
-
-Yes, there is two posiblity
-
-1. js comment , if you write js comment but it is not needed then it will be add into i18n chunk  
-   `To Resolve` we currently do not have perfect idea for this, But we can check this by chunk size limit.  
-   `idea's will be welcome`
-2. like we said "we will concider all string which is in jsResource file as i18n keys",  
-   So if you use string not for i18n but it was in jsResource then it will be add into i18n chunk.  
-   `To Resolve` this problem we can use some kinda prefix or something.
-
-### how do we downlowd and give to app?
-
-we have over write defualt webpack requireEnsure (every dynamic chunk requests are done by that function) function.  
- and we parlarly dowload i18n files. and we ask jsonFunction, to our plugin.  
-So we send i18nkeys , when it was download,  
-you must store all i18n keys, we give asycrnsly by that function download in that patticular.  
-so you must store and update (like append or assign) everytime that function call.
-
-### how to use this feature?
-
-to use this feature use have give the below oprtions  
- `package.json`
-
-```json
-{
-  /// ...some things
-  "react-cli": {
-    //  ...some things
-    "i18n": {
-      "chunkSplitEnable": true,
-      "jsResource": "./deskapp/properties/JSResources.properties",
-      "localeVarName": "window.userInfo.langCode",
-      "jsonpFunc": "window.loadI18nChunk",
-      "templateLabel": "{{--user-locale}}", // this is  for html template i18n file path locate template
-      "propertiesFolder": "./deskapp/properties"
-    }
-    //  ...some things
-  }
-}
-```
-
-<!-- not need below -->
-<!--we have added new feature for css to write logic to how hover related css work in hoverhover and a
-
-### is there any problems with static analysis?
-  Yes,
-
-### how do we use dynamic i18n key?
-
-  and we will download i18n file with
-
-  and when js chunk download's then we will download i18n as need.
-  we all know in our app we loading i18n as one single big file for each locale(language).
-  we are going to split i18n as per js chunk, and when js chunk download's then we will download i18n as need.
-
-
-  -->

package/es/shared/bundler/webpack/custom_plugins/I18nSplitPlugin/LocaleChunkAssetsStore.js

@@ -1,59 +0,0 @@
-import { ModulesI18nKeysStore } from "./ModulesI18nKeysStore";
-export class LocaleChunkAssetsStore extends ModulesI18nKeysStore {
-  constructor() {
-    super();
-    this.data = {};
-  }
-
-  clear() {
-    this.data = {};
-  }
-
-  storeData(chunkId, locale, data) {
-    if (!this.data[chunkId]) {
-      this.data[chunkId] = {};
-    }
-
-    const chunkBasedData = this.data[chunkId];
-    chunkBasedData[locale] = { ...(chunkBasedData[locale] || {}),
-      ...data
-    };
-  }
-
-  getChunkIdsWhichHasI18n() {
-    return Object.keys(this.data);
-  }
-
-  forEachChunkId(cb) {
-    // Object.keys(localeChunkAssestMap).forEach
-    this.getChunkIdsWhichHasI18n().forEach(cb);
-  }
-
-  isChunkHasI18n(chunkId) {
-    if (typeof chunkId === 'object') {
-      return super.isChunkHasI18n(chunkId);
-    }
-
-    return !!this.data[chunkId];
-  }
-
-  getDate(chunkId, locale) {
-    return this.data[chunkId]?.[locale];
-  }
-
-  getContent(chunkId, locale) {
-    return this.data[chunkId]?.[locale]?.content;
-  }
-
-  getContentHash(chunkId, locale) {
-    return this.data[chunkId]?.[locale]?.contentHash;
-  }
-
-}
-const storeCache = new WeakMap();
-export function getLocaleChunkAssetsStore(compilation) {
-  return storeCache.get(compilation);
-}
-export function setLocaleChunkAssetsStore(compilation, store) {
-  return storeCache.set(compilation, store);
-}

package/es/shared/bundler/webpack/custom_plugins/I18nSplitPlugin/ModulesI18nKeysStore.js

@@ -1,82 +0,0 @@
-import { iterateModulesInChunk } from "./iterateModulesInChunk";
-export class ModulesI18nKeysStore {
-  constructor() {
-    this.modulesI18nKeysMap = {};
-    this.compilation = null;
-  }
-
-  updateCompilation(compilation) {
-    this.compilation = compilation;
-  }
-
-  updateModuleI18nKeys(resource, i18nKeys) {
-    this.modulesI18nKeysMap[resource] = i18nKeys;
-  }
-
-  getModuleI18nKeys(resource) {
-    return this.modulesI18nKeysMap[resource];
-  }
-
-  isChunkHasI18n(chunk) {
-    const {
-      modulesI18nKeysMap,
-      compilation
-    } = this;
-    let hasModuleI18n = false;
-    iterateModulesInChunk({
-      chunk,
-      compilation,
-      cb: _ref => {
-        let {
-          module: mod,
-          stop: stopLoop
-        } = _ref;
-
-        if (mod.resource) {
-          const keys = modulesI18nKeysMap[mod.resource];
-
-          if (keys && keys.length > 0) {
-            hasModuleI18n = true;
-            stopLoop();
-          }
-        }
-      }
-    });
-    return hasModuleI18n;
-  }
-
-  getI18nKeysForChunk(chunk) {
-    const {
-      modulesI18nKeysMap,
-      compilation
-    } = this;
-    const i18nKeysMap = {};
-
-    function updateI18nKeys(mod) {
-      const keys = modulesI18nKeysMap[mod.resource];
-
-      if (keys) {
-        // eslint-disable-next-line no-restricted-syntax
-        for (const key of keys) {
-          i18nKeysMap[key] = 1;
-        }
-      }
-    }
-
-    iterateModulesInChunk({
-      chunk,
-      compilation,
-      cb: _ref2 => {
-        let {
-          module: mod
-        } = _ref2;
-
-        if (mod.resource) {
-          updateI18nKeys(mod);
-        }
-      }
-    });
-    return Object.keys(i18nKeysMap);
-  }
-
-}

package/es/shared/bundler/webpack/custom_plugins/I18nSplitPlugin/README.md

@@ -1,25 +0,0 @@
-# I18n Split As Chunks Plugin
-
-generaly we have manage our all I18n keys and values as language specific i18n files and then we download all i18n in initial page load.
-
-Ok, what is the problem with this?.
-the problem is i18n file keep get's grown it will affect the the inital page load and critial rendering path.
-So, We have decide to create a plugin for split i18n per chunk's of js vise, Which mean we diside to create for each js chunk has its own i18n chunks, with this we already load Js chunks are on demand and now we also download i18n also ondemand with this the initial and forthere actions.
-
-Ok, How to you do this thing?
-we have read the js chunk and collect I18n keys what are used in that chunk and we will create i18n chunk files with only used key.
-
-Ok, How do you collect that keys?
-we now have two experimental stage to collect I18n keys.
-
-1. we read jsResource.properties (or all keys I18n file) then we walk this AST of js and we collect all string which is jsResource.properties.
-2. for dynamic we discide to use comment some thing like
-   `// I18n support.tickekt.email.notvalid`
-
-ok, how do you downlowd and give to app?
-we have over write defualt webpack require ensure function.
-So every dynamic chunk requset are done by that function.
-So we parlarly dowload i18n files. and we ask jsonFunction, to our plugin.
-So we send i18nkeys , when it was download,
-you must store all i18n keys, we give asycrnsly by that function download in that patticular.
-so you must store and update (like append or assign) everytime that function call.