@zohodesk/react-cli 0.0.1-test.148.2 → 1.0.0

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

@@ -10,21 +10,28 @@ var _pluginUtils = require("../pluginUtils");
 
 var _loaderUtils = require("../loaderUtils");
 
+var _configsAssetsLoaders = require("../loaderUtils/configsAssetsLoaders");
+
+var _resolvers = require("./resolvers");
+
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
-let options = (0, _utils.getOptions)();
-let {
+// import TerserPlugin from 'terser-webpack-plugin';
+const options = (0, _utils.getOptions)();
+const {
   app: {
     folder,
     context,
-    enableChunkHash,
     outputFolder,
     disableES5Transpile,
     removeAttribute,
     enableSMap,
     server,
-    hasRTL,
-    rtlExclude,
+    plugins,
+    exclude,
+    mediaQueryHoverActiveString,
+    cssVariableReplacementConfig,
+    selectorWeightConfig,
     cssUniqueness,
     server: {
       mode
@@ -35,30 +42,38 @@ let {
     classNamePrefix,
     selectorReplace,
     removePropTypes,
-    devConsoleExculde
+    devConsoleExculde,
+    crossorigin
   }
 } = options;
-let appPath = process.cwd();
-let isDevelopment = mode === 'prod' || mode === 'dev' || mode === 'dev-no-warn';
+let {
+  enableChunkHash
+} = options.app;
+const appPath = process.cwd();
+const isDevelopment = mode === 'prod' || mode === 'dev' || mode === 'dev-no-warn';
 enableChunkHash = !isDevelopment && enableChunkHash;
-let output = {
+const output = {
   path: _path.default.resolve(appPath, outputFolder),
-  filename: enableChunkHash ? './js/[name].[chunkhash:20]_.js' : './js/[name]_.js',
-  chunkFilename: enableChunkHash ? './js/[name].[chunkhash:20]_.js' : './js/[name]_.js',
+  filename: enableChunkHash ? 'js/[name].[chunkhash:20]_.js' : 'js/[name]_.js',
+  chunkFilename: enableChunkHash ? 'js/[name].[chunkhash:20]_.js' : 'js/[name]_.js',
   jsonpFunction: `${context}Jsonp`,
-  sourceMapFilename: enableChunkHash ? 'smap/[name].[chunkhash:20]_.map' : 'smap/[name]_.map'
+  sourceMapFilename: enableChunkHash ? 'js/[name].[chunkhash:20]_.js.map' : 'js/[name]_.js.map'
 };
 
+if (crossorigin) {
+  output.crossOriginLoading = 'anonymous';
+}
+
 if (isDevelopment) {
-  let {
+  const {
     disableContextURL
   } = server;
-  let contextURL = disableContextURL ? '' : context;
-  let serverUrl = (0, _utils.getServerURL)(server, 'https');
+  const contextURL = disableContextURL ? '' : context;
+  const serverUrl = (0, _utils.getServerURL)(server, 'https');
   output.publicPath = `${[serverUrl, contextURL].filter(a => a).join('/')}/`;
 }
 
-let shouldRemovePropTypes = !isDevelopment && removePropTypes;
+const shouldRemovePropTypes = !isDevelopment && removePropTypes;
 module.exports = {
   entry: (0, _common.getEntries)(options, 'production'),
   devtool: isDevelopment ? 'cheap-module-source-map' : enableSMap ? 'hidden-source-map' : 'none',
@@ -71,12 +86,23 @@ module.exports = {
     },
     concatenateModules: true,
     minimize: true,
+    // by  default if  minimize: true in webpack minimize then webpack automaticaly add TerserPlugin,
+    //  So we are overrideing it.
+    // minimizer: [
+    //   new TerserPlugin({
+    //     cache: true,
+    //     parallel: true,
+    //     sourceMap: isDevelopment && enableSMap,
+    //     exclude: /\/smap/
+    //   })
+    // ],
     moduleIds: 'named'
   },
   stats: {
     children: false,
     colors: true,
     // excludeAssets: /i18n/,
+    // excludeAssets: /./,
     warningsFilter: /\[mini-css-extract-plugin\]/
   },
   plugins: (0, _pluginUtils.getProdPlugins)(options, output.publicPath),
@@ -108,11 +134,12 @@ module.exports = {
           }] : null].filter(Boolean),
           cacheDirectory: true
         }
-      }],
+      }].filter(Boolean),
+      // include: path.join(appPath, folder)
       include: module => {
-        let srcPath = _path.default.join(appPath, folder);
+        const srcPath = _path.default.join(appPath, folder);
 
-        let depsPath = _path.default.join(appPath, 'node_modules', '@zohodesk');
+        const depsPath = _path.default.join(appPath, 'node_modules', '@zohodesk');
 
         if (module.includes(srcPath) || devConsoleExculde && module.includes(depsPath)) {
           return true;
@@ -123,10 +150,30 @@ module.exports = {
     }, seperateCssModules ? {
       test: /\.css$/,
       exclude: /\.module\.css$/,
-      use: (0, _loaderUtils.getCSSLoaders)(hasRTL, rtlExclude, '[local]', false, null)
+      use: (0, _loaderUtils.getCSSLoaders)({
+        plugins,
+        exclude,
+        cssVariableReplacementConfig,
+        selectorWeightConfig,
+        mediaQueryHoverActiveString,
+        classNameBlob: '[local]',
+        cssUniqueness: false,
+        selectorReplace: null
+      })
     } : null, {
-      test: seperateCssModules ? /\.module\.css$/ : /(\.module)?\.css$/,
-      use: (0, _loaderUtils.getCSSLoaders)(hasRTL, rtlExclude, false, cssUniqueness, selectorReplace, cssHashSelectors, classNamePrefix)
+      test: seperateCssModules ? /\.module\.css$/ : /\.css$/,
+      use: (0, _loaderUtils.getCSSLoaders)({
+        plugins,
+        exclude,
+        mediaQueryHoverActiveString,
+        cssVariableReplacementConfig,
+        selectorWeightConfig,
+        classNameBlob: false,
+        cssUniqueness,
+        selectorReplace,
+        cssHashSelectors,
+        classNamePrefix
+      })
     }, {
       test: /\.jpe?g$|\.gif$|\.png$/,
       use: [{
@@ -137,7 +184,7 @@ module.exports = {
           fallback: _path.default.join(__dirname, '..', 'loaders', 'fileLoader.js')
         }
       }]
-    }, {
+    }, (0, _configsAssetsLoaders.configVideoLoaderObj)(enableChunkHash ? './videos/[name].[hash:20].[ext]' : './videos/[name].[ext]'), {
       test: /\.woff2|\.woff$|\.ttf$|\.eot$/,
       use: [{
         loader: 'url-loader',
@@ -187,28 +234,6 @@ module.exports = {
   externals: {
     ZC: '$ZC'
   },
-  resolve: {
-    modules: [_path.default.resolve(__dirname, '..', '..', 'node_modules'), 'node_modules'],
-    alias: disableES5Transpile ? {
-      '@zohodesk/components/lib': '@zohodesk/components/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'
-    } : {}
-  },
-  resolveLoader: {
-    modules: [_path.default.resolve(__dirname, '..', '..', 'node_modules'), 'node_modules']
-  }
+  resolve: (0, _resolvers.moduleResolver)(options),
+  resolveLoader: (0, _resolvers.loaderResolver)(options)
 };

package/lib/constants.js

@@ -0,0 +1,31 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.cliRootPath = exports.cliNodemodulesPath = exports.appPath = exports.CONFIG_ROOT = exports.BASE_CONFIG_KEY = void 0;
+
+var _path = _interopRequireDefault(require("path"));
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+const BASE_CONFIG_KEY = 'react-cli';
+exports.BASE_CONFIG_KEY = BASE_CONFIG_KEY;
+
+const cliRootPath = _path.default.resolve(__dirname, '..');
+
+exports.cliRootPath = cliRootPath;
+const CONFIG_ROOT = 'react-cli';
+exports.CONFIG_ROOT = CONFIG_ROOT;
+
+const cliNodemodulesPath = _path.default.resolve(cliRootPath, 'node_modules'); // export const babelrcPath = join(cliRootPath, '.babelrc');
+
+
+exports.cliNodemodulesPath = cliNodemodulesPath;
+const appPath = process.cwd(); // export const appInitialHTMLTemplatePath = path.join(
+//   process.cwd(),
+//   'src',
+//   'index.html'
+// );
+
+exports.appPath = appPath;

package/lib/jest/preProcessors/cssPreprocessor.js

@@ -6,23 +6,32 @@ var _postcssHashClassname = _interopRequireDefault(require("postcss-hash-classna
 
 var _fs = _interopRequireDefault(require("fs"));
 
+var _utils = require("../../utils");
+
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
 let count = 0;
+const options = (0, _utils.getOptions)();
+const {
+  classnameFormat
+} = options.test;
 module.exports = {
   process: function (src) {
     count++;
-    let opts = {
+    const opts = {
       hashType: 'md5',
-      digestType: 'base32'
+      digestType: 'base32',
+      maxLength: 6,
+      type: '.json',
+      classnameFormat: classnameFormat,
+      outputName: `jsonFile_test_${count}`
     };
-    opts.maxLength = 6;
-    opts.type = '.json';
-    opts.outputName = `jsonFile_test_${count}`;
-    let processor = (0, _postcss.default)([(0, _postcssHashClassname.default)(opts)]);
+    const processor = (0, _postcss.default)([(0, _postcssHashClassname.default)(opts)]);
     processor.process(src).css;
 
-    let jsonMap = _fs.default.readFileSync(`jsonFile_test_${count}.json`, 'UTF-8');
+    const jsonMap = _fs.default.readFileSync(`jsonFile_test_${count}.json`, 'UTF-8');
+
+    _fs.default.unlinkSync(`jsonFile_test_${count}.json`);
 
     return `module.exports =${jsonMap}`;
   }

package/lib/loaderUtils/configsAssetsLoaders.js

@@ -0,0 +1,117 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.configAudioLoader = configAudioLoader;
+exports.configFontLoader = configFontLoader;
+exports.configImageLoader = configImageLoader;
+exports.configSVGLoader = configSVGLoader;
+exports.configVideoLoader = configVideoLoader;
+exports.configVideoLoaderObj = configVideoLoaderObj;
+exports.createNameTemplate = createNameTemplate;
+
+var _path = _interopRequireDefault(require("path"));
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+// function getLoaderOptionQueryString(params) {
+const ImageExtRegex = /\.jpe?g$|\.gif$|\.png|\.webp$/;
+const FontExtRegex = /\.woff2|\.woff$|\.ttf$|\.eot$/;
+const SVGExtRegex = /\.svg$/;
+const AudioExtRegex = /\.ogg$/;
+const VidioExtRegex = /\.mp4|\.webm$/;
+
+function createLoaderOptionQueryString(loaderName, nameTemplate, limit = 1000) {
+  return `${loaderName}?limit=${limit}&name=${nameTemplate}`;
+}
+
+function configImageLoader(nameTemplate) {
+  return {
+    test: ImageExtRegex,
+    use: createLoaderOptionQueryString('url-loader', `./images/${nameTemplate}`)
+  };
+}
+
+function configFontLoader(nameTemplate) {
+  return {
+    test: FontExtRegex,
+    use: createLoaderOptionQueryString('url-loader', `./fonts/${nameTemplate}`)
+  };
+}
+
+function configSVGLoader(nameTemplate) {
+  return {
+    test: SVGExtRegex,
+    use: createLoaderOptionQueryString('url-loader', `./fonts/${nameTemplate}`, 1)
+  };
+}
+
+function configAudioLoader(nameTemplate) {
+  return {
+    test: AudioExtRegex,
+    use: createLoaderOptionQueryString('file-loader', `./fonts/${nameTemplate}`, 1)
+  };
+}
+
+function configVideoLoader(nameTemplate) {
+  return {
+    test: VidioExtRegex,
+    use: createLoaderOptionQueryString('url-loader', `./videos/${nameTemplate}`, 1)
+  };
+}
+
+function configVideoLoaderObj(nameTemplate) {
+  return {
+    test: VidioExtRegex,
+    use: {
+      loader: 'url-loader',
+      options: {
+        limit: 1000,
+        name: nameTemplate,
+        fallback: _path.default.join(__dirname, '..', 'loaders', 'fileLoader.js')
+      }
+    }
+  };
+}
+
+function createNameTemplate(enableChunkHash) {
+  const ext = `${enableChunkHash ? '.[hash:20]' : ''}.[ext]`;
+  return `[name]${ext}`;
+}
+/*
+export function createImageAndFontsAndSVGLoaders(enableChunkHash) {
+  const nameTemplate = createNameTemplate(enableChunkHash);
+  return [
+    configImageLoader(nameTemplate),
+    configFontLoader(nameTemplate),
+    configSVGLoader(nameTemplate),
+    configAudioLoader(nameTemplate)
+  ];
+}
+*/
+
+/*
+export function createLoaderOptionObject(
+  loaderName,
+  nameTemplate,
+  fallback,
+  limit = 1000
+) {
+  return {
+    loader: loaderName,
+    options: {
+      limit,
+      name: nameTemplate,
+      fallback
+    }
+  };
+}
+
+function configLoaderObject(filter, loaderAndOptions) {
+  return {
+    test: filter,
+    use: loaderAndOptions
+  };
+}
+*/

package/lib/loaderUtils/getCSSLoaders.js

@@ -9,24 +9,98 @@ var _miniCssExtractPlugin = _interopRequireDefault(require("mini-css-extract-plu
 
 var _cssClassNameGenerate = _interopRequireDefault(require("../utils/cssClassNameGenerate"));
 
+var _utils = require("../utils");
+
+var _windowsModification = require("./windowsModification");
+
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
-let isWin = process.platform === 'win32';
+const fs = require('fs');
+
+const options = (0, _utils.getOptions)();
 
-let getCSSLoaders = (hasRTL, rtlExclude, classNameBlob, cssUniqueness, selectorReplace, cssHashSelectors, classNamePrefix) => {
-  let rtlExcludeLocal = isWin ? rtlExclude.map(r => r.replace(/\//g, '\\')) : rtlExclude;
-  let cssLoaderOptions = {
-    importLoaders: hasRTL ? 1 : 0,
-    modules: {}
+function excludeEmptyCheckPlugin({
+  enable,
+  ignore,
+  plugins
+}) {
+  return enable ? ignore.length === 0 ? plugins : [require('../postcss-plugins/ExcludePlugin')({
+    ignore,
+    plugins
+  })] : [];
+}
+
+const getCSSLoaders = optionsObj => {
+  const {
+    plugins,
+    exclude,
+    mediaQueryHoverActiveString,
+    cssVariableReplacementConfig,
+    classNameBlob,
+    cssUniqueness,
+    selectorReplace,
+    cssHashSelectors,
+    classNamePrefix
+  } = optionsObj; // console.log('plugins:')
+  // console.log(plugins)
+  // console.log('exclude:')
+  // console.log(exclude)
+
+  const {
+    devCssFileBountry
+  } = options.app;
+  const {
+    valueReplacer
+  } = options.css;
+  const {
+    cssSelectorZipPath
+  } = options.impactService;
+  const rtlExcludeLocal = (0, _windowsModification.windowsModification)(exclude.rtl);
+  const hoverActiveExcludeLocal = (0, _windowsModification.windowsModification)(exclude.hoverActive);
+  const combinerMediaQueryExcludeLocal = (0, _windowsModification.windowsModification)(exclude.combinerMediaQuery);
+  const cssVariableReplacementExcludeLocal = (0, _windowsModification.windowsModification)(exclude.cssVariableReplacement);
+  const cssLoaderOptions = {
+    // importLoaders: hasRTL||hoverActive ? 1 : 0,
+    importLoaders: 1,
+    modules: {},
+    sourceMap: true
   };
 
   if (classNameBlob) {
     cssLoaderOptions.modules.localIdentName = classNameBlob;
   } else {
     cssLoaderOptions.modules.getLocalIdent = (0, _cssClassNameGenerate.default)(cssUniqueness, cssHashSelectors, classNamePrefix);
-  }
+  } // console.log('selector weight config : ', selectorWeightConfig);
+
 
-  return [{
+  const postcssPlugins = [valueReplacer && require('../postcss-plugins/ValueReplacer')(valueReplacer), selectorReplace && require('postcss-selector-replace')(selectorReplace), ...excludeEmptyCheckPlugin({
+    enable: plugins.hasRTL,
+    ignore: rtlExcludeLocal,
+    plugins: [require('@zohodesk/postcss-rtl')({
+      addPrefixToSelector: function addPrefixToSelector(selector, prefix) {
+        if (prefix === '[dir]') {
+          return selector;
+        }
+
+        return `${prefix} ${selector}`; // Make selectors like [dir=rtl] > .selector
+      }
+    })]
+  }), ...excludeEmptyCheckPlugin({
+    enable: plugins.combinerMediaQuery,
+    ignore: combinerMediaQueryExcludeLocal,
+    plugins: [require('postcss-combine-media-query')]
+  }), ...excludeEmptyCheckPlugin({
+    enable: plugins.hoverActive,
+    ignore: hoverActiveExcludeLocal,
+    plugins: [require('../postcss-plugins/hoverActivePlugin')(mediaQueryHoverActiveString)]
+  }), ...excludeEmptyCheckPlugin({
+    enable: plugins.cssVariableReplacement,
+    ignore: cssVariableReplacementExcludeLocal,
+    plugins: [fs.existsSync(cssVariableReplacementConfig) && require('../postcss-plugins/variableModificationPlugin/index').plugin(cssVariableReplacementConfig)]
+  })].filter(Boolean);
+  return [cssSelectorZipPath && {
+    loader: require.resolve('../loaders/selectorMappingLoader')
+  }, {
     loader: _miniCssExtractPlugin.default.loader,
     options: {
       publicPath: '../'
@@ -34,23 +108,17 @@ let getCSSLoaders = (hasRTL, rtlExclude, classNameBlob, cssUniqueness, selectorR
   }, {
     loader: 'css-loader',
     options: cssLoaderOptions
-  }, hasRTL || selectorReplace ? {
+  }, devCssFileBountry && {
+    loader: require.resolve('../loaders/fileBountryLoader'),
+    options: {
+      devCssFileBountry
+    }
+  }, postcssPlugins.length > 0 ? {
     loader: 'postcss-loader',
     options: {
       ident: 'postcss',
       plugins: function () {
-        return [selectorReplace && require('postcss-selector-replace')(selectorReplace), hasRTL && require('../postcss-plugins/ExcludeRTLPlugin')({
-          ignore: rtlExcludeLocal,
-          plugins: [require('@zohodesk/postcss-rtl')({
-            addPrefixToSelector: function addPrefixToSelector(selector, prefix) {
-              if (prefix === '[dir]') {
-                return selector;
-              }
-
-              return `${prefix} ${selector}`; // Make selectors like [dir=rtl] > .selector
-            }
-          })]
-        })].filter(Boolean);
+        return postcssPlugins;
       }
     }
   } : null].filter(Boolean);

package/lib/loaderUtils/index.js

@@ -3,16 +3,16 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-Object.defineProperty(exports, "getDevJsLoaders", {
+Object.defineProperty(exports, "getCSSLoaders", {
   enumerable: true,
   get: function () {
-    return _getDevJsLoaders.default;
+    return _getCSSLoaders.default;
   }
 });
-Object.defineProperty(exports, "getCSSLoaders", {
+Object.defineProperty(exports, "getDevJsLoaders", {
   enumerable: true,
   get: function () {
-    return _getCSSLoaders.default;
+    return _getDevJsLoaders.default;
   }
 });
 

package/lib/loaderUtils/windowsModification.js

@@ -0,0 +1,11 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.windowsModification = windowsModification;
+const isWin = process.platform === 'win32';
+
+function windowsModification(array) {
+  return isWin ? array && Array.isArray(array) && array.map(r => r.replace(/\//g, '\\')) : array;
+}

package/lib/loaders/fileBountryLoader.js

@@ -0,0 +1,17 @@
+"use strict";
+
+var _path = _interopRequireDefault(require("path"));
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+module.exports = function (source) {
+  const {
+    rootContext,
+    resourcePath,
+    query
+  } = this;
+  const {
+    devCssFileBountry
+  } = query;
+  return `/*${devCssFileBountry} ${_path.default.relative(rootContext, resourcePath)}*/\n${source}`;
+};

package/lib/loaders/scriptInstrumentLoader.js

@@ -6,9 +6,9 @@ var _escodegen = _interopRequireDefault(require("escodegen"));
 
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
-function _getRequireWildcardCache() { if (typeof WeakMap !== "function") return null; var cache = new WeakMap(); _getRequireWildcardCache = function () { return cache; }; return cache; }
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
 
-function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
 
 let start = {
   type: 'ExpressionStatement',

package/lib/loaders/selectorMappingLoader.js

@@ -0,0 +1,75 @@
+"use strict";
+
+var _path = _interopRequireDefault(require("path"));
+
+var _fs = _interopRequireDefault(require("fs"));
+
+var _utils = require("../utils");
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+let options = (0, _utils.getOptions)();
+const {
+  cssSelectorZipPath
+} = options.impactService;
+
+const zipname = _path.default.parse(cssSelectorZipPath).name; // console.log({ cssSelectorZipPath, zipname });
+// TODO:NOTE: need to check about .. path related files creation 
+// for now  no css files have given  form react-cli need to make sure about it.  
+
+
+let zippath = _path.default.join(process.cwd(), cssSelectorZipPath);
+
+if (_fs.default.existsSync(_path.default.join(process.cwd(), cssSelectorZipPath))) {
+  _fs.default.rmSync(zippath);
+
+  console.log('zip file deleted', zippath); // fs.rmSync(zippath, {force:true})
+  // console.log('created folder ==> ', dpath);
+} // const minicssComment =
+//   '// extracted by mini-css-extract-plugin\n';
+
+
+const startStr = '// extracted by mini-css-extract-plugin\n' + 'module.exports = ';
+
+module.exports = function (source) {
+  const {
+    rootContext,
+    resourcePath
+  } = this;
+
+  const relativePath = _path.default.relative(rootContext, resourcePath);
+
+  let fpath = _path.default.join(rootContext, zipname, relativePath);
+
+  let originalpath = _path.default.join(rootContext, relativePath);
+
+  if (relativePath.startsWith('..')) {
+    throw `unexpected path ${relativePath}`;
+  }
+
+  let dpath = fpath.slice(0, fpath.lastIndexOf(_path.default.sep));
+
+  if (!_fs.default.existsSync(originalpath)) {
+    throw `originalpath not exixt ${originalpath}`;
+  }
+
+  if (!_fs.default.existsSync(dpath)) {
+    _fs.default.mkdirSync(dpath, {
+      recursive: true
+    });
+  }
+
+  let jsonStr = '{}';
+
+  if (source.startsWith(startStr)) {
+    // source will  be  like 
+    // `// extracted by mini-css-extract-plugin\nmodule.exports = {"app":"zd-app"};`
+    jsonStr = source.slice(startStr.length, -1);
+  }
+
+  _fs.default.writeFileSync(`${fpath}_map`, jsonStr);
+
+  _fs.default.writeFileSync(fpath, _fs.default.readFileSync(originalpath));
+
+  return source;
+};