@zohodesk/react-cli 1.1.24 → 1.1.25-exp.2

package/README.md

@@ -44,6 +44,10 @@ Now to run app
 
 # Change Logs
 
+# 1.1.25 (12-08-2024) 
+
+ - mp3 files support added
+
 # 1.1.24 (29-06-2024)
 
 - Worker loading logic fixes.

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

@@ -43,7 +43,8 @@ const {
     crossorigin,
     postCssPluginOrder,
     externals,
-    enableMjsLoader
+    enableMjsLoader,
+    displayClassName
   },
   enableTypeScript
 } = options;
@@ -120,7 +121,8 @@ module.exports = {
         classNameBlob: '[local]',
         cssUniqueness: false,
         selectorReplace: null,
-        postCssPluginOrder
+        postCssPluginOrder,
+        displayClassName
       })
     } : null, {
       test: seperateCssModules ? /\.module\.css$/ : /(\.module)?\.css$/,
@@ -137,7 +139,8 @@ module.exports = {
         selectorReplace,
         cssHashSelectors,
         classNamePrefix,
-        postCssPluginOrder
+        postCssPluginOrder,
+        displayClassName
       })
     }, (0, _configsAssetsLoaders.configImageLoader)(nameTemplate), (0, _configsAssetsLoaders.configFontLoader)(nameTemplate), (0, _configsAssetsLoaders.configSVGLoader)(nameTemplate), (0, _configsAssetsLoaders.configVideoLoader)(nameTemplate), (0, _configsAssetsLoaders.configAudioLoader)(nameTemplate), {
       test: /\.tmpl$/,

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

@@ -36,6 +36,7 @@ const {
     cssVariableReplacementConfig,
     selectorWeightConfig,
     cssUniqueness,
+    displayClassName,
     customClassNamePrefix,
     server: {
       mode
@@ -173,7 +174,8 @@ module.exports = {
         cssUniqueness: false,
         customClassNamePrefix,
         selectorReplace: null,
-        postCssPluginOrder
+        postCssPluginOrder,
+        displayClassName
       })
     } : null, {
       test: seperateCssModules ? /\.module\.css$/ : /\.css$/,
@@ -190,7 +192,8 @@ module.exports = {
         selectorReplace,
         cssHashSelectors,
         classNamePrefix,
-        postCssPluginOrder
+        postCssPluginOrder,
+        displayClassName
       })
     }, {
       test: /\.jpe?g$|\.gif$|\.png$/,
@@ -223,7 +226,7 @@ module.exports = {
         }
       }]
     }, {
-      test: /\.ogg$/,
+      test: /\.ogg|\.mp3$/,
       use: [{
         loader: 'file-loader',
         options: {

package/lib/loaderUtils/configsAssetsLoaders.js

@@ -19,7 +19,7 @@ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { de
 const ImageExtRegex = /\.jpe?g$|\.gif$|\.png|\.webp$/;
 const FontExtRegex = /\.woff2|\.woff$|\.ttf$|\.eot$/;
 const SVGExtRegex = /\.svg$/;
-const AudioExtRegex = /\.ogg$/;
+const AudioExtRegex = /\.ogg|\.mp3$/;
 const VidioExtRegex = /\.mp4|\.webm$/;
 
 function createLoaderOptionQueryString(loaderName, nameTemplate, limit = 1000) {

package/lib/loaderUtils/getCSSLoaders.js

@@ -45,7 +45,8 @@ const getCSSLoaders = optionsObj => {
     cssHashSelectors,
     classNamePrefix,
     postCssPluginOrder,
-    customClassNamePrefix
+    customClassNamePrefix,
+    displayClassName
   } = optionsObj;
   const {
     devCssFileBountry
@@ -66,7 +67,7 @@ const getCSSLoaders = optionsObj => {
   if (classNameBlob) {
     cssLoaderOptions.modules.localIdentName = classNameBlob;
   } else {
-    cssLoaderOptions.modules.getLocalIdent = (0, _cssClassNameGenerate.default)(cssUniqueness, cssHashSelectors, classNamePrefix, customClassNamePrefix, patterns);
+    cssLoaderOptions.modules.getLocalIdent = (0, _cssClassNameGenerate.default)(cssUniqueness, cssHashSelectors, classNamePrefix, customClassNamePrefix, patterns, displayClassName);
   }
 
   const pluginOrder = calculatePostCssPluginOrder(postCssPluginOrder, Object.keys(plugins).filter(x => plugins[x] === true)); // console.log('selector weight config : ', selectorWeightConfig);

package/lib/pluginUtils/getDevPlugins.js

@@ -33,14 +33,13 @@ var _VariableConversionCollector = _interopRequireDefault(require("../plugins/Va
 
 var _SelectorPlugin = _interopRequireDefault(require("../plugins/SelectorPlugin"));
 
-var _configHtmlWebpackPlugins = require("./configHtmlWebpackPlugins");
-
 var _EfcResourceCleanupPlugin = _interopRequireDefault(require("../plugins/EfcResourceCleanupPlugin"));
 
 var _EventsHandlingPlugin = require("../plugins/EventsHandlingPlugin");
 
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
+// import { configHtmlWebpackPlugins } from './configHtmlWebpackPlugins';
 // import { windowsModification } from '../loaderUtils/windowsModification';
 const getDevPlugins = (options, publicPath) => {
   const {
@@ -162,16 +161,15 @@ const getDevPlugins = (options, publicPath) => {
   pluginsArr.push(new _lodashWebpackPlugin.default({
     collections: true,
     shorthands: true
-  }));
-  (0, _configHtmlWebpackPlugins.configHtmlWebpackPlugins)(pluginsArr, {
-    enableChunkHash: false,
-    folder,
-    minify: false,
-    inject,
-    crossorigin,
-    hasEFC,
-    customScriptLoadingStrategey
-  });
+  })); // configHtmlWebpackPlugins(pluginsArr, {
+  //   enableChunkHash: false,
+  //   folder,
+  //   minify: false,
+  //   inject,
+  //   crossorigin,
+  //   hasEFC,
+  //   customScriptLoadingStrategey,
+  // });
 
   if (hasEFC) {
     pluginsArr.push(new _plugins.EFCPlugin({

package/lib/pluginUtils/getProdPlugins.js

@@ -35,14 +35,13 @@ var _CustomAttributePlugin = require("../plugins/CustomAttributePlugin");
 
 var _RtlCssPlugin = require("../plugins/RtlSplitPlugin/RtlCssPlugin");
 
-var _configHtmlWebpackPlugins = require("./configHtmlWebpackPlugins");
-
 var _StatsPlugin = _interopRequireDefault(require("../plugins/StatsPlugin"));
 
 var _EfcResourceCleanupPlugin = _interopRequireDefault(require("../plugins/EfcResourceCleanupPlugin"));
 
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
+// import { configHtmlWebpackPlugins } from './configHtmlWebpackPlugins';
 // eslint-disable-next-line no-unused-vars
 const getProdPlugins = (options, publicPath = '') => {
   let {
@@ -173,16 +172,15 @@ const getProdPlugins = (options, publicPath = '') => {
     from: `${_path.default.join(process.cwd(), context, tpFolder)}/`,
     to: `./${tpFolder}/`,
     toType: 'dir'
-  }]));
-  (0, _configHtmlWebpackPlugins.configHtmlWebpackPlugins)(pluginsArr, {
-    enableChunkHash,
-    folder,
-    inject,
-    minify: minifyHtmlOptions,
-    customScriptLoadingStrategey,
-    crossorigin,
-    hasEFC
-  });
+  }])); // configHtmlWebpackPlugins(pluginsArr, {
+  //   enableChunkHash,
+  //   folder,
+  //   inject,
+  //   minify: minifyHtmlOptions,
+  //   customScriptLoadingStrategey,
+  //   crossorigin,
+  //   hasEFC
+  // });
 
   if (hasEFC) {
     pluginsArr.push(new _plugins.EFCPlugin({

package/lib/schemas/index.js

@@ -126,6 +126,10 @@ var _default = {
     cssDirStatement: null
   },
   app: {
+    displayClassName: {
+      value: false,
+      cli: 'display_class_name'
+    },
     moduleResolvePath: {
       value: '@zohodesk/client_packages_group',
       cli: 'module_resolve_path'

package/lib/utils/cssClassNameGenerate.js

@@ -62,7 +62,7 @@ function patternBasedClass({
 var _default = (unique = true, {
   filenames,
   packages
-}, classNamePrefix, customClassNamePrefix, patterns) => (context, localIdentName, localName) => {
+}, classNamePrefix, customClassNamePrefix, patterns, displayClassName) => (context, localIdentName, localName) => {
   // console.log(patterns, context.resourcePath);
   // NOTE:  in build machine we use date as folder path.
   // So every time we create new build there is path will alway different
@@ -92,6 +92,11 @@ var _default = (unique = true, {
   */
 
 
+  if (displayClassName) {
+    return `${fileNameWithoutExt}_${localName}`;
+  } //  return cleanFileName
+
+
   if (context.resourcePath.endsWith('.plain.css')) {
     return localName;
   }

package/lib/utils/getFileType.js

@@ -45,5 +45,5 @@ function isVideoFileExt(ext) {
 }
 
 function isAudioFileExt(ext) {
-  return ext === '.ogg';
+  return ext === '.ogg' || ext === '.mp3';
 }