@zohodesk/react-cli 0.0.1-exp.160.3 → 0.0.1-exp.162.2

package/.eslintrc.js

@@ -108,7 +108,7 @@ let commonConfigs = {
     'comma-dangle': [logLevel],
     'comma-spacing': [logLevel],
     'func-call-spacing': [logLevel],
-    indent: [logLevel, 2, { SwitchCase: 1 }],
+    indent: ['off', 2, { SwitchCase: 1 }],
     'jsx-quotes': [logLevel, 'prefer-single'],
     'key-spacing': [logLevel],
     'keyword-spacing': [logLevel],

package/README.md

@@ -1,39 +1,111 @@
 # React CLI
 
 A CLI tool for build modern web application and libraries
+
+# 0.0.1-exp.162.2
+
+- **Optimazation:-**
+  - double time minimize optimazation
+
+# 0.0.1-beta.162.1
+
+- **Issue Fix:-**
+  - if git not installed react-cli throws error for any command due to `getCurrentBranch` in `shemas/index.js` now fixed
+
+# 0.0.1-beta.161.1
+
+- **Features :-**
+  - feature added for pre process logic
+    - tailer made requirement for preprocess, just write node js file
+    - mention file in `"react-cli" => "preprocess" => "runner"`
+  - option parse logic added for react-cli (exprimental)
+
+# 0.0.1-beta.161
+
+- **Features :-**
+  - feature added for efc `templateFilePath` in `package.json` option palce is `"react-cli" => "efc" => "templateFilePath"`
+  - `(('publicPath'))` this placeholder will be replace as publicPath string `publicPath`
+  - `(('getInitalAssets'))` this placeholder will be replace as function `getInitalAssets`
+  - `getInitalAssets` this function has two arguments `assetsType`, `lang`
+    - `assetsType` are `js`, `css`, `i18n`
+    - `lang` this argument only works when `i18n` is `assetsType`
+  - feature added for efc `cdnStatement`
+- **Issue fixes:-**
+  - css classname hash change issue fix
+  - debug package conflit issue fix in nock in (react-cli test)
+  - manifest.json css file name correction issue for rtl and ltr
+
+# 0.0.1-exp.161.2
+
+- Features
+  - feature added for efc `templateFilePath` in `package.json` option palce is `"react-cli" => "efc" `
+    - `(('publicPath'))` this placeholder will be replace as publicPath string `publicPath`
+    - `(('getInitalAssets'))` this placeholder will be replace as function `getInitalAssets`
+    - `getInitalAssets` this function has two arguments `assetsType`, `lang`
+      - `assetsType` are `js`, `css`, `i18n`
+      - `lang` this argument only works when `i18n` is `assetsType`
+
+# 0.0.1-exp.161.1
+
+- Features
+  - feature added for efc `cdnStatement`
+- Issue fixes:-
+  - css classname hash change issue fix
+  - debug package conflit issue fix in nock in (react-cli test)npm i @zohodesk/virtualizer
+  - manifest.json css file name correction issue for rtl and ltr
+
 # 0.0.1-beta.160
+
 - @zohodesk/normalizer package version updated to 1.0.2
+
 # 0.0.1-beta.159
+
 - @zohodesk/datetimejs package updated to beta.7
+
+# 0.0.1-exp.159
+
+- isse fix:-
+  - when rtl ltr css split enable manifest json css filename keys comes with hash .
+
 # 0.0.1-beta.158
-  - Removing source map files from service worker caching.
+
+- Removing source map files from service worker caching.
+
 # 0.0.1-beta.157
-  - Experimental version issue fix(Dummy version removed)
+
+- Experimental version issue fix(Dummy version removed)
+
 # 0.0.1-beta.156
-  - ReportPublish issue fix
+
+- ReportPublish issue fix
 
 # 0.0.1-beta.155
-  - get impacted library source files option added
+
+- get impacted library source files option added
 
 # 0.0.1-beta.154
-  - mockPrefix option for mock url prefix change
-  - Issue fix:-
-    - un wanted {{--js-smap}} in inital html without enable smap in build
+
+- mockPrefix option for mock url prefix change
+- Issue fix:-
+  - un wanted {{--js-smap}} in inital html without enable smap in build
 
 # 0.0.1-beta.153
+
 - Vendor include array added
   - If you need to include any thrid party js in vendor we can use this array
 
 # 0.0.1-beta.152
+
 impact servise related changes:-
+
 - nowatchstart option added. will be used like `react-cli nowatchstart <...options>` this will be used for src file changes no need to reflect (or no need to rebulid on file changes)
 - cssselector_zip option added. will be used like `--cssselector-zip=selectormapping.zip`
   only work in two ways
   1. `react-cli start --disable-watch --cssselector-zip=selectormapping.zip` app start command with `--disable-watch` flag and your usaul options
   2. `react-cli nowatchstart --cssselector-zip=selectormapping.zip` app start command's usaul options
   #### Urls are:-
-  Below express path are added, For download zip files and  
-  - `/zips/${zipname}.zip`  for  css selector maps zip file (contains css_map filies  and original css files)
+  Below express path are added, For download zip files and
+  - `/zips/${zipname}.zip` for css selector maps zip file (contains css_map filies and original css files)
   - `/zips/build.zip` build zip file (contains bundled all files)
 
 # 0.0.1-beta.151

package/bin/cli.js

@@ -2,7 +2,7 @@
 
 let path = require('path');
 let os = require('os');
-let { spawnSync } = require('child_process');
+let { spawnSync, spawn } = require('child_process');
 let { getOptions } = require('../lib/utils/index.js');
 
 let { log } = require('../lib/utils');
@@ -42,8 +42,53 @@ let babel = getCliPath('babel');
 let propertyToJson = getCliPath('propertyToJson');
 let esLint = getCliPath('eslint');
 
+let preprocesserPath = options.preprocessor.runner
+  ? path.join(process.cwd(), options.preprocessor.runner)
+  : '';
+
+// console.log(
+//   'options.app.preprocessor',
+//   options.preprocessor.runner,
+//   preprocesserPath
+// );
+if (preprocesserPath) {
+  // eslint-disable-next-line default-case
+  switch (option) {
+    case 'start':
+    case 'docs':
+      spawn(nodemon, [preprocesserPath], {
+        stdio: 'inherit',
+        cwd: preprocesserPath.slice(0, preprocesserPath.lastIndexOf('/') + 1)
+      });
+      // NOTE:  it's ok if  we  not  close this  here
+      // Because when  node server stops this program willbe closed So this  nodemon  will be killed  as well
+      break;
+    case 'nowatchstart':
+    case 'build:library:es':
+    case 'build:component:es':
+    case 'build:library:cmjs':
+    case 'build:component:cmjs':
+      spawnSync('node', [preprocesserPath], {
+        stdio: 'inherit',
+        cwd: preprocesserPath.slice(0, preprocesserPath.lastIndexOf('/') + 1)
+      });
+      break;
+  }
+}
+
 let result;
 switch (option) {
+  case 'preprocessor':
+    if (preprocesserPath) {
+      result = spawnSync(nodemon, [preprocesserPath], {
+        stdio: 'inherit',
+        cwd: preprocesserPath.slice(0, preprocesserPath.lastIndexOf('/') + 1)
+      });
+      process.exit(result.status);
+    } else {
+      console.error('preProcessor not exists ');
+    }
+    break;
   case 'lint-setup': {
     result = spawnSync(
       'node',
@@ -219,11 +264,14 @@ switch (option) {
       webpack,
       [
         '--config',
-        require.resolve('../lib/configs/webpack.prod.config.js')
+        require.resolve('../lib/configs/webpack.prod.config.js'),
+        '--progress',
+        '--profile'
       ].concat(args),
       { stdio: 'inherit' }
     );
 
+    // console.log(result);
     process.exit(result.status);
     break;
 

package/eslint/NOTES.md

@@ -0,0 +1,3 @@
+Suggestions :
+
+1. 'lint-setup', 'add-lint-scripts' not need to exposed

package/eslint/mockapi.html

@@ -0,0 +1,18 @@
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
+    <title>mock api</title>
+  </head>
+  <body>
+    <h1>We are going to see how to use mock api</h1>
+    <ul>
+      <li>
+        Step 1:-
+        you need to start the app with "react-cli"."app"."server"."hasMock" as "true" in package.json
+        <code>npm run start --app-port=9090</code>
+      </li>
+    </ul>
+  </body>
+</html>

package/eslint/mockapi.md

@@ -0,0 +1,5 @@
+# We are going to see how to use `Mock api`
+
+- Step 1:-
+  you need to start the app with **"react-cli"."app"."server"."hasMock"** as `true` and **"react-cli"."app"."server"."hasMock"** as `true` in package.json <code>npm run start --app-port=9090</code>
+- Step 2:- you need to start the app with **"react-cli"."app"."server"."hasMock"** as `true` in package.json <code>npm run start --app-port=9090</code>

package/lib/configs/jest.config.js

@@ -2,9 +2,17 @@
 
 var _path = _interopRequireDefault(require("path"));
 
+var _libAlias = require("./libAlias");
+
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
-let appPath = process.cwd();
+let appPath = process.cwd(); //   '^@root(.*)$': '<rootDir>/src$1',
+// '^@components(.*)$': '<rootDir>/src/components$1',
+
+let moduleNameMapper = Object.keys(_libAlias.libAlias).reduce((previousValue, key) => {
+  previousValue[`^${key}(.*)$`] = `${_libAlias.libAlias[key]}$1`;
+  return previousValue;
+}, {});
 let commonConfig = {
   coverageReporters: ['json', 'html', 'json-summary', 'text'],
   collectCoverage: true,
@@ -14,10 +22,11 @@ let commonConfig = {
     '^.+\\.css$': _path.default.resolve(__dirname, '..', 'jest', 'preProcessors', 'cssPreprocessor.js'),
     '^(?!.*\\.(js|jsx|css|json)$)': _path.default.resolve(__dirname, '..', 'jest', 'preProcessors', 'otherFilesPreprocessor.js')
   },
-  moduleNameMapper: {
+  moduleNameMapper: { ...moduleNameMapper,
     '\\.(css|less)$': 'identity-obj-proxy'
   },
-  transformIgnorePatterns: ['/node_modules.*?.js$'],
+  transformIgnorePatterns: ['/node_modules/(?!(@zohodesk)/)'],
+  // transformIgnorePatterns: ['/node_modules.*?.js$'],
   moduleFileExtensions: ['js'],
   setupFiles: [_path.default.resolve(appPath, '__testUtils__', 'globals.js'), _path.default.resolve(__dirname, '..', 'jest', 'setup.js')],
   globals: {

package/lib/configs/libAlias.js

@@ -0,0 +1,31 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.libAlias = void 0;
+// the reason for alias at the time was code tree shaking
+// tree shaking was most compactable with ES module system
+// FIXME: But there is a posiblity when these  package  does not have lib,
+//  app will work because of alias, But may be jest won't work because of not alais
+//  So need to think about use alais in jest 
+const libAlias = {
+  '@zohodesk/components/lib': '@zohodesk/components/es',
+  // '@zohodesk/zc-custom/lib': '@zohodesk/zc-custom/es',
+  '@zohodesk/dot/lib': '@zohodesk/dot/es',
+  '@zohodesk/i18n/lib': '@zohodesk/i18n/es',
+  '@zohodesk/icons/lib': '@zohodesk/icons/es',
+  '@zohodesk/normalizer/lib': '@zohodesk/normalizer/es',
+  '@zohodesk/perf-components/lib': '@zohodesk/perf-components/es',
+  '@zohodesk/perf-middleware/lib': '@zohodesk/perf-middleware/es',
+  '@zohodesk/permissions/lib': '@zohodesk/permissions/es',
+  '@zohodesk/platform-middleware/lib': '@zohodesk/platform-middleware/es',
+  '@zohodesk/react-dnd/lib': '@zohodesk/react-dnd/es',
+  '@zohodesk/router-middleware/lib': '@zohodesk/router-middleware/es',
+  '@zohodesk/storage/lib': '@zohodesk/storage/es',
+  '@zohodesk/svg/lib': '@zohodesk/svg/es',
+  '@zohodesk/timetracker/lib': '@zohodesk/timetracker/es',
+  '@zohodesk/variables/lib': '@zohodesk/variables/es',
+  '@zohodesk/virtualizer/lib': '@zohodesk/virtualizer/es'
+};
+exports.libAlias = libAlias;

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

@@ -10,6 +10,8 @@ var _pluginUtils = require("../pluginUtils");
 
 var _loaderUtils = require("../loaderUtils");
 
+var _libAlias = require("./libAlias");
+
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
 let options = (0, _utils.getOptions)();
@@ -55,6 +57,9 @@ module.exports = {
   entry: (0, _common.getEntries)(options, 'dev'),
   devtool: sourcemap,
   mode: 'development',
+  watchOptions: {
+    ignored: /node_modules.(?!@zohodesk)/
+  },
   output,
   stats: options.app.disableWatch ? 'errors-only' : {
     children: false
@@ -127,25 +132,7 @@ module.exports = {
   },
   resolve: {
     modules: [_path.default.resolve(__dirname, '..', '..', 'node_modules'), 'node_modules'],
-    alias: disableES5Transpile ? {
-      '@zohodesk/components/lib': '@zohodesk/components/es',
-      // "@zohodesk/zc-custom/lib": "@zohodesk/zc-custom/es",
-      '@zohodesk/dot/lib': '@zohodesk/dot/es',
-      '@zohodesk/i18n/lib': '@zohodesk/i18n/es',
-      '@zohodesk/icons/lib': '@zohodesk/icons/es',
-      '@zohodesk/normalizer/lib': '@zohodesk/normalizer/es',
-      '@zohodesk/perf-components/lib': '@zohodesk/perf-components/es',
-      '@zohodesk/perf-middleware/lib': '@zohodesk/perf-middleware/es',
-      '@zohodesk/permissions/lib': '@zohodesk/permissions/es',
-      '@zohodesk/platform-middleware/lib': '@zohodesk/platform-middleware/es',
-      '@zohodesk/react-dnd/lib': '@zohodesk/react-dnd/es',
-      '@zohodesk/router-middleware/lib': '@zohodesk/router-middleware/es',
-      '@zohodesk/storage/lib': '@zohodesk/storage/es',
-      '@zohodesk/svg/lib': '@zohodesk/svg/es',
-      '@zohodesk/timetracker/lib': '@zohodesk/timetracker/es',
-      '@zohodesk/variables/lib': '@zohodesk/variables/es',
-      '@zohodesk/virtualizer/lib': '@zohodesk/virtualizer/es'
-    } : {}
+    alias: disableES5Transpile ? _libAlias.libAlias : {}
   },
   resolveLoader: {
     modules: [_path.default.resolve(__dirname, '..', '..', 'node_modules'), 'node_modules']

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

@@ -10,11 +10,12 @@ var _pluginUtils = require("../pluginUtils");
 
 var _loaderUtils = require("../loaderUtils");
 
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+var _libAlias = require("./libAlias");
+
+var _terserWebpackPlugin = _interopRequireDefault(require("terser-webpack-plugin"));
 
-const SpeedMeasurePlugin = require('speed-measure-webpack-plugin');
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
-const smp = new SpeedMeasurePlugin();
 let options = (0, _utils.getOptions)();
 let {
   app: {
@@ -67,7 +68,11 @@ if (isDevelopment) {
 }
 
 let shouldRemovePropTypes = !isDevelopment && removePropTypes;
-module.exports = smp.wrap({
+const useEsbulid = false; // const SpeedMeasurePlugin = require("speed-measure-webpack-plugin");
+// const smp = new SpeedMeasurePlugin();
+// module.exports =  smp.wrap({
+
+module.exports = {
   entry: (0, _common.getEntries)(options, 'production'),
   devtool: isDevelopment ? 'cheap-module-source-map' : enableSMap ? 'hidden-source-map' : 'none',
   mode: 'production',
@@ -79,12 +84,20 @@ module.exports = smp.wrap({
     },
     concatenateModules: true,
     minimize: true,
+    // by  default if  minimize: true in webpack minimize then webpack automaticaly add TerserPlugin,
+    //  So we are overrideing it. 
+    minimizer: [new _terserWebpackPlugin.default({
+      cache: true,
+      parallel: true,
+      sourceMap: isDevelopment && enableSMap,
+      exclude: /\/smap/
+    })],
     moduleIds: 'named'
   },
   stats: {
     children: false,
     colors: true,
-    excludeAssets: /i18n|\.map$/,
+    excludeAssets: /./,
     warningsFilter: /\[mini-css-extract-plugin\]/
   },
   plugins: (0, _pluginUtils.getProdPlugins)(options, output.publicPath),
@@ -93,7 +106,15 @@ module.exports = smp.wrap({
     strictExportPresence: true,
     rules: [{
       test: /\.js$/,
-      use: [{
+      use: [useEsbulid && {
+        loader: 'esbuild-loader',
+        options: {
+          loader: 'jsx',
+          // Remove this if you're not using JSX
+          target: 'es2015' // Syntax to compile to (see options below for possible values)
+
+        }
+      }, !useEsbulid && {
         loader: 'babel-loader',
         options: {
           presets: [[require.resolve('@babel/preset-env'), disableES5Transpile ? {
@@ -116,7 +137,8 @@ module.exports = smp.wrap({
           }] : null].filter(Boolean),
           cacheDirectory: true
         }
-      }],
+      }].filter(Boolean),
+      // include: path.join(appPath, folder)
       include: module => {
         let srcPath = _path.default.join(appPath, folder);
 
@@ -133,7 +155,7 @@ module.exports = smp.wrap({
       exclude: /\.module\.css$/,
       use: (0, _loaderUtils.getCSSLoaders)(hasRTL, rtlExclude, '[local]', false, null)
     } : null, {
-      test: seperateCssModules ? /\.module\.css$/ : /(\.module)?\.css$/,
+      test: seperateCssModules ? /\.module\.css$/ : /\.css$/,
       use: (0, _loaderUtils.getCSSLoaders)(hasRTL, rtlExclude, false, cssUniqueness, selectorReplace, cssHashSelectors, classNamePrefix)
     }, {
       test: /\.jpe?g$|\.gif$|\.png$/,
@@ -197,27 +219,9 @@ module.exports = smp.wrap({
   },
   resolve: {
     modules: [_path.default.resolve(__dirname, '..', '..', 'node_modules'), 'node_modules'],
-    alias: disableES5Transpile ? {
-      '@zohodesk/components/lib': '@zohodesk/components/es',
-      // '@zohodesk/zc-custom/lib': '@zohodesk/zc-custom/es',
-      '@zohodesk/dot/lib': '@zohodesk/dot/es',
-      '@zohodesk/i18n/lib': '@zohodesk/i18n/es',
-      '@zohodesk/icons/lib': '@zohodesk/icons/es',
-      '@zohodesk/normalizer/lib': '@zohodesk/normalizer/es',
-      '@zohodesk/perf-components/lib': '@zohodesk/perf-components/es',
-      '@zohodesk/perf-middleware/lib': '@zohodesk/perf-middleware/es',
-      '@zohodesk/permissions/lib': '@zohodesk/permissions/es',
-      '@zohodesk/platform-middleware/lib': '@zohodesk/platform-middleware/es',
-      '@zohodesk/react-dnd/lib': '@zohodesk/react-dnd/es',
-      '@zohodesk/router-middleware/lib': '@zohodesk/router-middleware/es',
-      '@zohodesk/storage/lib': '@zohodesk/storage/es',
-      '@zohodesk/svg/lib': '@zohodesk/svg/es',
-      '@zohodesk/timetracker/lib': '@zohodesk/timetracker/es',
-      '@zohodesk/variables/lib': '@zohodesk/variables/es',
-      '@zohodesk/virtualizer/lib': '@zohodesk/virtualizer/es'
-    } : {}
+    alias: disableES5Transpile ? _libAlias.libAlias : {}
   },
   resolveLoader: {
     modules: [_path.default.resolve(__dirname, '..', '..', 'node_modules'), 'node_modules']
   }
-});
+};

package/lib/pluginUtils/getDevPlugins.js

@@ -55,6 +55,7 @@ let getDevPlugins = (options, publicPath) => {
     },
     efc: {
       hasEFC: newOptionForEnableEFC,
+      templateFilePath,
       nameScope: efcNameSpace,
       localeAttr: efcLocaleAttr
     },
@@ -162,6 +163,7 @@ let getDevPlugins = (options, publicPath) => {
     plugins.push(new _plugins.EFCPlugin({
       isDevelopment: true,
       i18nManifestFileName,
+      templateFilePath,
       i18nFileNameTemplate,
       serverUrl: publicPath,
       entryPointName: 'efc',

package/lib/pluginUtils/getProdPlugins.js

@@ -11,6 +11,8 @@ var _fs = _interopRequireDefault(require("fs"));
 
 var _webpack = _interopRequireDefault(require("webpack"));
 
+var _caseSensitivePathsWebpackPlugin = _interopRequireDefault(require("case-sensitive-paths-webpack-plugin"));
+
 var _webpackBundleAnalyzer = require("webpack-bundle-analyzer");
 
 var _lodashWebpackPlugin = _interopRequireDefault(require("lodash-webpack-plugin"));
@@ -33,8 +35,10 @@ var _RtlCssPlugin = require("../plugins/RtlSplitPlugin/RtlCssPlugin");
 
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
-// import CaseSensitivePathsPlugin from 'case-sensitive-paths-webpack-plugin';
+// import { ESBuildMinifyPlugin } from 'esbuild-loader';
+const useEsbulid = false; // console.log('build is runnnig');
 // eslint-disable-next-line no-unused-vars
+
 let getProdPlugins = (options, publicPath = '') => {
   let {
     enableChunkHash,
@@ -71,6 +75,7 @@ let getProdPlugins = (options, publicPath = '') => {
   const {
     hasEFC: newOptionForEnableEFC,
     nameScope: efcNameSpace,
+    templateFilePath,
     localeAttr: efcLocaleAttr
   } = options.efc;
   const hasEFC = newOptionForEnableEFC || prevOptionForEnableEFC;
@@ -79,8 +84,7 @@ let getProdPlugins = (options, publicPath = '') => {
   const cssRTLFileNameTempalte = `css/[name]${hashTempalate}.rtl.css`;
   let isDevelopment = mode === 'prod' || mode === 'dev' || mode === 'dev-no-warn';
   enableChunkHash = !isDevelopment && enableChunkHash;
-  let plugins = [// new CaseSensitivePathsPlugin(),
-  new _webpack.default.IgnorePlugin(/^\.\/locale$/, /moment$/), new _webpack.default.DefinePlugin({
+  let plugins = [new _caseSensitivePathsWebpackPlugin.default(), new _webpack.default.IgnorePlugin(/^\.\/locale$/, /moment$/), new _webpack.default.DefinePlugin({
     __TEST__: false,
     __DEVELOPMENT__: false,
     __LOCAL_PRODUCTION__: isDevelopment,
@@ -93,7 +97,7 @@ let getProdPlugins = (options, publicPath = '') => {
     // ignoreOrder: true,
     filename: cssLTRFileNameTempalte,
     chunkFilename: cssLTRFileNameTempalte
-  }), new _plugins.ResourceHintsPlugin(), new _plugins.UglifyCSSPlugin()];
+  }), new _plugins.ResourceHintsPlugin(), !useEsbulid && new _plugins.UglifyCSSPlugin()].filter(Boolean);
 
   if (enableRTLSplit) {
     plugins.push(new _RtlCssPlugin.RtlCssPlugin({
@@ -166,6 +170,7 @@ let getProdPlugins = (options, publicPath = '') => {
       isDevelopment,
       serverUrl: publicPath,
       i18nFileNameTemplate,
+      templateFilePath,
       i18nManifestFileName,
       entryPointName: 'efc',
       // outputFile: 'zohodesk-efc-sdk-latest.js',
@@ -221,8 +226,11 @@ let getProdPlugins = (options, publicPath = '') => {
   hasShadowDOM && plugins.push(new _plugins.ShadowDOMSupportPlugin());
 
   if (!isDevelopment) {
-    enableSMap && enableSMapHook && plugins.push(new _plugins.SourceMapHookPlugin());
-    optimize && plugins.push(new _plugins.OptimizeJSPlugin());
+    enableSMap && enableSMapHook && plugins.push(new _plugins.SourceMapHookPlugin()); // optimize && plugins.push(new OptimizeJSPlugin());
+    // optimize &&
+    //   plugins.push(
+    //   );
+
     plugins.push(new _plugins.ManifestPlugin({
       fileName: manifestFileName
     }));

package/lib/plugins/EFCPlugin.js

@@ -17,6 +17,8 @@ var _I18nKeysIdentifer = _interopRequireDefault(require("./I18nSplitPlugin/I18nK
 
 var _replaceCssDirTemplate = require("./RtlSplitPlugin/replaceCssDirTemplate");
 
+var _EFCTemplatePlugin = _interopRequireDefault(require("./EFCTemplatePlugin"));
+
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
 // import { getShortI18nAssets } from './I18nSplitPlugin/utils/hashUtils';
@@ -34,17 +36,19 @@ const {
   efc: efcOptios
 } = cliOptions;
 const {
-  createSDkFile
+  createSDkFile,
+  cdnStatement
 } = efcOptios;
 
 class EFCPlugin {
   constructor(options = {}) {
     this.isDevelopment = options.isDevelopment;
+    this.templateFilePath = options.templateFilePath;
     this.serverUrl = options.serverUrl;
     this.i18nFileNameTemplate = options.i18nFileNameTemplate; // NOTE: this logic may be needed for i18n splited file name with contenthash cases
     // this.i18nManifestFileName = options.i18nManifestFileName;
     // IMPORTANT: here we mergeing optionds  from  pacakge.json  and options via constructor
-    // So when debugging consider this as well 
+    // So when debugging consider this as well
 
     this.options = Object.assign({}, efcOptios, options);
     this.options.entryPointName = options.entryPointName || 'efc';
@@ -125,20 +129,35 @@ class EFCPlugin {
   ${enableRTLSplit ? `const cssDir = ${cssDirStatement};` : ''}
   const prod = !${this.isDevelopment};
   let cdnVariableName = "${cdnVariableName}";
-  let assetURLs = {
-    //hook
-    js: ${JSON.stringify(jsPath || serverUrl)},
-    css: ${JSON.stringify(cssPath || serverUrl)},
-    i18n: ${JSON.stringify(i18nJsPath || serverUrl)}
-  };
+
+  function getAssetUrl(ext) {
+    ${cdnStatement ? `
+    return (() => {
+      let fu = (${cdnStatement});
+      return typeof fu === "function" ? fu(ext) : fu;
+    })();` : ''}
+
+    ${publicPaths.callback ? `return (${publicPaths.callback})(ext)` : ''}
+    
+    let assetURLs = {
+      //hook
+      js: ${JSON.stringify(jsPath || serverUrl)},
+      css: ${JSON.stringify(cssPath || serverUrl)},
+      i18n: ${JSON.stringify(i18nJsPath || serverUrl)}
+    };
+
+    return assetURLs[ext];
+
+  }
+  
 
   window.desk_urls={}
-  window.desk_urls.staticDomain = 'https:' + assetURLs.js + '/';
+  window.desk_urls.staticDomain = 'https:' + getAssetUrl('js') + '/';
   if (prod && cdnVariableName) {
-    window["${cdnVariableName}"] = 'https:' + assetURLs.css + '/';
+    window["${cdnVariableName}"] = 'https:' + getAssetUrl('css') + '/';
   }
 
-  let initalI18nAssets = ${initalI18nAssets}.map(urlpath => "${i18nJsPath}/"+ urlpath);
+  let initalI18nAssets = ${initalI18nAssets};
   let initialAssets = initalI18nAssets.concat(${JSON.stringify(enableRTLSplit ? filteredInitialFiles.map(filePath => (0, _replaceCssDirTemplate.replaceCssDirTemplate)(filePath, cssDirTemplate)) : filteredInitialFiles)});
 
   let loadAsset = (id, type, url) => {
@@ -150,12 +169,12 @@ class EFCPlugin {
       switch(type) {
         case 'script':
         case 'i18n':
-          el.src = (type === 'i18n'? assetURLs.i18n : assetURLs.js)+'/'+url
+          el.src = (type === 'i18n'? getAssetUrl('i18n') : getAssetUrl('js'))+'/'+url
           el.defer = 'defer';
           document.body.appendChild(el);
           break;
         case 'link':
-          el.href = assetURLs.css+'/'+url${enableRTLSplit ? `.replace(${JSON.stringify(cssDirTemplate)}, cssDir)` : ''}
+          el.href = getAssetUrl('css')+'/'+url${enableRTLSplit ? `.replace(${JSON.stringify(cssDirTemplate)}, cssDir)` : ''}
           el.rel = 'stylesheet';
           document.head.appendChild(el);
           break;
@@ -186,6 +205,17 @@ class EFCPlugin {
   apply(compiler) {
     if (!createSDkFile) {
       return;
+    } //console.log('this.templateFilePath', this.templateFilePath, this.options);
+
+
+    if (this.templateFilePath) {
+      new _EFCTemplatePlugin.default({
+        templateFilePath: this.templateFilePath,
+        publicPath: this.serverUrl,
+        i18nFileNameTemplate: this.i18nFileNameTemplate,
+        entryPointName: this.options.entryPointName
+      }).apply(compiler);
+      return;
     }
 
     compiler.hooks.emit.tap('EFCPlugin', compilation => {