@zohodesk/react-cli 1.1.8 → 1.1.9

package/README.md

@@ -43,6 +43,29 @@ Now to run app
 ---
 
 # Change Logs
+# 1.1.9 (25-7-2023)
+
+**Features:-**
+
+- we have added config file support for react-cli schema. the default config file name `build.config.js` support added. In `build.config.js` you must export configuration object under `config` key. And Note: `build.config.js` is high priority then `package.json` `react-cli` config.
+- added support for using regex expression to get group of chunks chunkId via Resource Hint plugin prefetch/preload hook.
+  only will be activate when `resourceHints` => `allowPrefetchingMultipleChunks` as `true`
+- added support for pattern as function for custom chunks split logic.
+- added options to split chunks base config in the key `app` => `customChunksBaseConfig` as object
+- added `postCssPluginOrder` feature :
+  - If `app > postCssPluginOrder` or `docs > postCssPluginOrder` is set to "false", default plugin order will be followed.
+  - If `app > postCssPluginOrder` or `docs > postCssPluginOrder` is set to "true", order preserved in `plugins`  Object will be considered.
+  - If `app > postCssPluginOrder` or `docs > postCssPluginOrder` is set to an array with plugins in a custom order, the custom order will be considered.
+
+- We use the same plugin names as in `patterns` for the plugins to execute successfully.  
+
+
+**Issue Fix**
+- fixed file path separator issue with split chunks config for vendor exclude list for windows (that was work well for mac and ubuntu only issue in windows).
+- fixed cssUniqueness pattern not working in docs.
+
+**Changes**
+- previously all custom chunks are enforce true, no we have given support for enforce false for chunks on splitChunks config.
 
 # 1.1.8
 
@@ -56,6 +79,20 @@ Now to run app
 For more info please refer to :
 [details](https://zgit.csez.zohocorpin.com/zohodesk/react-cli/-/blob/2.0.0/docs/MarkdownParser.md)
 
+
+# 1.1.6-exp.2
+- fixed file path separator issue with split chunks config for vendor exclude list.
+- added support for not doing enforce true for chunks on splitchunks config.
+
+# 1.1.5-exp.5
+- fixed the issues regarding custom chunks base config schema.
+
+# 1.1.5-exp.4
+- added support for using regex expression to get group of chunks chunkId via Resource Hint plugin prefetch/preload hook.
+
+# 1.1.5-exp.3
+- added options to split chunks base config
+- added support for passing custom chunks split logic as function.
 # 1.1.6
 
 **Issue Fix**

package/bin/cli.js

@@ -3,13 +3,17 @@
 const path = require('path');
 const { existsSync } = require('fs');
 const { spawnSync: _spawnSync, spawn } = require('child_process');
-const { getOptions } = require('../lib/utils/index.js');
+const getOptions = require('../lib/utils/getOptions.js').default;
 
-const { log } = require('../lib/utils');
+const { log } = require('../lib/utils/log.js');
 const { getCliPath } = require('../lib/servers/getCliPath.js');
 //initPreCommitHook();
 
-const options = getOptions();
+const [, , option] = process.argv;
+const args = process.argv.slice(3);
+const appPath = process.cwd();
+
+const options = getOptions({ start: true, build: true, docs: true }[option]);
 
 function spawnSync(...args) {
   const result = _spawnSync(...args);
@@ -28,10 +32,6 @@ const {
   reportPath: reportPath
 } = esLintOptions || {};
 
-const [, , option] = process.argv;
-const args = process.argv.slice(3);
-const appPath = process.cwd();
-
 const webpack = getCliPath('webpack');
 
 const nodemon = getCliPath('nodemon');
@@ -48,10 +48,14 @@ if (preprocesserPath && existsSync(preprocesserPath)) {
   switch (option) {
     case 'start':
     case 'docs':
-      spawn(preprocessCli, [preprocesserPath], {
-        stdio: 'inherit',
-        cwd: path.parse(preprocesserPath).dir
-      });
+      spawn(
+        preprocessCli,
+        [preprocesserPath, '--watch', path.parse(preprocesserPath).dir],
+        {
+          stdio: 'inherit',
+          cwd: path.parse(preprocesserPath).dir
+        }
+      );
       // 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;
@@ -270,7 +274,7 @@ switch (option) {
         require.resolve('../lib/servers/mockserver.js'),
         '--delay',
         '2500ms',
-        'watch',
+        '--watch',
         `${appPath + path.sep}mockapi`
       ].concat(args),
       { stdio: 'inherit' }

package/docs/CustomChunks.md

@@ -4,23 +4,26 @@ In react-cli we provide options to create custom chunks.
 This Custom Chunk Option is array of Object
 that Object keys are
 
-- `pattern` regex pattern as string
-- `name` chunk name
-- `size` is count which is minmum chunk dublicated or need in chunks
+- `pattern` **{ String | Function | Array<String> }** regex pattern as string and custom logic to split chunks can be defined using function
+- `name` **{ String }** chunk name
+- `size` **{ Number }** is count which is minimum chunk duplicated or need in chunks
 
 > Since 0.0.1-exp.164.1
 
 extra features in custom chunks :-
 for more details [SplitChunkPlugin](https://webpack.js.org/plugins/split-chunks-plugin/) webpack
 
-- `minChunks`: `minChunks` is alies of `size` default value is `2`,
-- `rules`: `rules` is same as `pattern` with some easy hooks
+- `minChunks`: `minChunks` is alias of `size` default value is `2`,
+- `rules`: `rules` is same as `pattern` with some easy hooks **(removed after v1.1.5)**
   - use `/` for both windows and linux we will replace internally
   - for `.*` we need to use `*`
   - we can consider rules as regex when the `rules-string` has any of these `*`, `^`, `$`. So if you want regex then kindly use `*` in your `rules-string` for force regex
 - `chunks`: by this option we can specify , default value is `all`,
 - `priority`: priority default value is `-10 * (index + 2)`,
-- `enforce`: enforce default value is true,
-- `maxSize`: maxSize, default value is 0,
-- `minSize`: minSize, default value is 20000,
-  includeDepenency: includeDepenency default value is false
+- `enforce`: enforce default value is `true`,
+- `maxSize`: maxSize, default value is `0`,
+- `minSize`: minSize, default value is `20000`,
+- `reuseExistingChunk` If the current chunk contains modules already split out from the main bundle, it will be reused instead of a new one being generated. This can affect the resulting file name of the chunk.
+- `automaticNamePrefix` with this you can specify for chunks created through that specified config. default value `''`.
+- `cacheGroupName`: `cacheGroupName` is alias of `name`, But it won't work as chunk name, instead it will just work as key in cacheGroup.
+<!-- includeDependency: includeDependency default value is `false` -->

package/lib/common/splitChunks.js

@@ -15,35 +15,53 @@ var _testPattern = require("./testPattern");
 
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
-let isWindows = _os.default.platform().toLowerCase() === 'win32';
-let ps = _path.default.sep;
-let options = (0, _utils.getOptions)();
-let {
+const isWindows = _os.default.platform().toLowerCase() === 'win32';
+const ps = _path.default.sep;
+const options = (0, _utils.getOptions)();
+const {
   app: {
     vendorExclude,
     customChunks,
-    vendorInclude
+    vendorInclude,
+    customChunksBaseConfig
   }
 } = options;
+const reactBundleIncludeList = ['react', 'react-dom', 'react-redux', 'react-transition-group', 'scheduler', 'prop-types'];
+const vendorExcludeList = ['script-loader', 'raw-loader', ...reactBundleIncludeList, ...vendorExclude.map(vendorPath => vendorPath.replace(/[/\\]/g, _path.default.sep))];
+const vendorIncludeList = [...vendorInclude].map(vendorPath => vendorPath.replace(/[/\\]/g, _path.default.sep));
 
-let isVendor = function isVendor(module) {
-  let {
+const isVendor = function isVendor(module) {
+  const {
     userRequest
   } = module;
-  let excludeList = ['script-loader', 'raw-loader', 'react', 'react-dom'];
-  excludeList = [...excludeList, ...vendorExclude];
-  return userRequest && (vendorInclude.some(item => userRequest.indexOf(item) !== -1) || userRequest.indexOf('node_modules') >= 0 && userRequest.endsWith('.css') === false && userRequest.endsWith('publicPathConfig.js') === false && excludeList.every(item => userRequest.indexOf(`node_modules${ps}${item}${ps}`) === -1));
+  return userRequest && (vendorIncludeList.some(item => userRequest.indexOf(item) !== -1) || userRequest.indexOf('node_modules') >= 0 && userRequest.endsWith('.css') === false && userRequest.endsWith('publicPathConfig.js') === false && vendorExcludeList.every(item => userRequest.indexOf(`node_modules${ps}${item}${ps}`) === -1));
 };
 
-let isReact = module => {
-  let {
+const isReact = module => {
+  const {
     userRequest
   } = module;
-  let reactBundle = ['react', 'react-dom'];
-  return userRequest && reactBundle.some(pkg => userRequest.indexOf(`node_modules${ps}${pkg}${ps}`) >= 0);
+  return userRequest && reactBundleIncludeList.some(pkg => userRequest.indexOf(`node_modules${ps}${pkg}${ps}`) >= 0);
 };
 
-let defaultChunks = {
+function rulesMatcher(pattern) {
+  if (typeof pattern === 'function') {
+    return pattern;
+  }
+
+  if (Array.isArray(pattern)) {
+    return ({
+      userRequest
+    }) => (0, _testPattern.testPattern)(userRequest, pattern);
+  }
+
+  return new RegExp(isWindows ? pattern.replace(/\//g, '\\') : pattern);
+}
+
+const baseSplitChunkConfig = Object.assign({
+  minSize: 15000
+}, customChunksBaseConfig);
+const specificCacheGroupConfig = {
   'react.vendor': {
     name: 'react.vendor',
     chunks: 'all',
@@ -63,45 +81,35 @@ let defaultChunks = {
     priority: -10
   }
 };
-let customChunksConfig = {};
+const customChunksConfig = {};
 customChunks.map((obj, index) => ({
   name: obj.name,
-  pattern: obj.pattern,
+  chunks: obj.chunks || 'all',
   minChunks: obj.minChunks || obj.size || 2,
-  rules: obj.rules,
-  // includeDepenency: obj.includeDepenency || false,
+  pattern: obj.pattern,
   priority: obj.priority || -10 * (index + 2),
-  enforce: obj.enforce || true,
-  maxSize: obj.maxSize,
-  // || 0,
+  enforce: obj.enforce,
   minSize: obj.minSize,
   // || 20000,
-  chunks: obj.chunks || 'all'
-})).map(({
+  maxSize: obj.maxSize,
+  // || 0,
+  reuseExistingChunk: obj.reuseExistingChunk,
+  cacheGroupName: obj.cacheGroupName || obj.name
+})).forEach(({
   name,
-  pattern,
+  chunks = 'all',
   minChunks,
-  rules,
+  pattern,
   priority,
-  // includeDepenency,
   enforce,
   minSize,
   maxSize,
-  chunks = 'all'
+  reuseExistingChunk,
+  cacheGroupName
 }) => {
-  let obj = {
-    name,
-    test: rules ? m => {
-      const {
-        userRequest
-      } = m;
-      return (0, _testPattern.testPattern)(userRequest, rules); // return (
-      //   pkgs.some(p => isRelated(userRequest, p)) ||
-      //   (includeDepenency && isDependency(m, pkgs))
-      // );
-    } : new RegExp(isWindows ? pattern.replace(/\//g, '\\') : pattern),
+  const obj = {
+    test: rulesMatcher(pattern),
     chunks,
-    enforce,
     minChunks,
     priority
   };
@@ -114,13 +122,25 @@ customChunks.map((obj, index) => ({
     obj.maxSize = maxSize;
   }
 
-  return customChunksConfig[name] = obj;
+  if (enforce !== false) {
+    obj.enforce = true;
+  }
+
+  if (name !== undefined) {
+    obj.name = name;
+  }
+
+  if (reuseExistingChunk !== undefined) {
+    obj.reuseExistingChunk = reuseExistingChunk;
+  }
+
+  customChunksConfig[cacheGroupName] = obj;
 });
-var _default = {
-  minSize: 12000,
+const splitChunkConfig = Object.assign({}, baseSplitChunkConfig, {
   cacheGroups: Object.assign({
     default: false,
     vendors: false
-  }, defaultChunks, customChunksConfig)
-};
+  }, specificCacheGroupConfig, customChunksConfig)
+});
+var _default = splitChunkConfig;
 exports.default = _default;

package/lib/common/testPattern.js

@@ -13,25 +13,25 @@ var _path = require("path");
 const isWindows = _path.sep !== '/'; // this function  will  return true if pattern matched
 
 function _testPattern(req, pattern) {
-  let modifyedPattern = pattern;
+  let modifiedPattern = pattern;
 
-  if (/[*.$^]/.test(modifyedPattern)) {
+  if (/[*.$^]/.test(modifiedPattern)) {
     if (isWindows) {
-      // modifyedPattern = pattern.replace(/\//g, ps.replace(/\\/g, '\\\\'));
-      modifyedPattern = modifyedPattern.replace(/\//g, '\\\\');
+      // modifiedPattern = pattern.replace(/\//g, ps.replace(/\\/g, '\\\\'));
+      modifiedPattern = modifiedPattern.replace(/\//g, '\\\\');
     }
 
-    modifyedPattern = modifyedPattern.replace(/\./g, '\\.').replace(/\*/g, '.*');
-    const re = new RegExp(modifyedPattern);
+    modifiedPattern = modifiedPattern.replace(/\./g, '\\.').replace(/\*/g, '.*');
+    const re = new RegExp(modifiedPattern);
     return re.test(req);
   }
 
   if (isWindows) {
-    // modifyedPattern = pattern.replace(/\//g, ps.replace(/\\/g, '\\\\'));
-    modifyedPattern = modifyedPattern.replace(/\//g, '\\');
+    // modifiedPattern = pattern.replace(/\//g, ps.replace(/\\/g, '\\\\'));
+    modifiedPattern = modifiedPattern.replace(/\//g, '\\');
   }
 
-  return req.indexOf(modifyedPattern) !== -1;
+  return req.indexOf(modifiedPattern) !== -1;
 }
 
 function testPattern(req, pattern) {

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

@@ -39,7 +39,8 @@ const {
     selectorReplace,
     devConsoleExculde,
     sourcemap,
-    crossorigin
+    crossorigin,
+    postCssPluginOrder
   }
 } = options;
 const {
@@ -109,7 +110,8 @@ module.exports = {
         selectorWeightConfig,
         classNameBlob: '[local]',
         cssUniqueness: false,
-        selectorReplace: null
+        selectorReplace: null,
+        postCssPluginOrder
       })
     } : null, {
       test: seperateCssModules ? /\.module\.css$/ : /(\.module)?\.css$/,
@@ -124,7 +126,8 @@ module.exports = {
         cssUniqueness,
         selectorReplace,
         cssHashSelectors,
-        classNamePrefix
+        classNamePrefix,
+        postCssPluginOrder
       })
     }, (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.docs.config.js

@@ -28,7 +28,8 @@ const {
     selectorWeightConfig,
     cssHashSelectors,
     classNamePrefix,
-    selectorReplace
+    selectorReplace,
+    postCssPluginOrder
   },
   app: {
     folder
@@ -87,7 +88,8 @@ module.exports = isSSTest => ({
         cssUniqueness,
         selectorReplace,
         cssHashSelectors,
-        classNamePrefix
+        classNamePrefix,
+        postCssPluginOrder
       })
     }, (0, _configsAssetsLoaders.configImageLoader)(nameTemplate), (0, _configsAssetsLoaders.configFontLoader)(nameTemplate), (0, _configsAssetsLoaders.configSVGLoader)(nameTemplate), (0, _configsAssetsLoaders.configAudioLoader)(nameTemplate), (0, _configsAssetsLoaders.configVideoLoader)(nameTemplate), {
       test: /\.html$/,

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

@@ -27,7 +27,8 @@ const {
     selectorWeightConfig,
     cssHashSelectors,
     enableChunkHash,
-    classNamePrefix
+    classNamePrefix,
+    postCssPluginOrder
   },
   app: {
     folder
@@ -86,7 +87,8 @@ module.exports = {
         cssUniqueness,
         selectorReplace: null,
         cssHashSelectors,
-        classNamePrefix
+        classNamePrefix,
+        postCssPluginOrder
       })
     }, (0, _configsAssetsLoaders.configImageLoader)(nameTemplate), (0, _configsAssetsLoaders.configFontLoader)(nameTemplate), (0, _configsAssetsLoaders.configSVGLoader)(nameTemplate), (0, _configsAssetsLoaders.configAudioLoader)(nameTemplate), (0, _configsAssetsLoaders.configVideoLoader)(nameTemplate), {
       test: /\.html$/,

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

@@ -44,7 +44,8 @@ const {
     selectorReplace,
     removePropTypes,
     devConsoleExculde,
-    crossorigin
+    crossorigin,
+    postCssPluginOrder
   }
 } = options;
 let {
@@ -160,7 +161,8 @@ module.exports = {
         mediaQueryHoverActiveString,
         classNameBlob: '[local]',
         cssUniqueness: false,
-        selectorReplace: null
+        selectorReplace: null,
+        postCssPluginOrder
       })
     } : null, {
       test: seperateCssModules ? /\.module\.css$/ : /\.css$/,
@@ -175,7 +177,8 @@ module.exports = {
         cssUniqueness,
         selectorReplace,
         cssHashSelectors,
-        classNamePrefix
+        classNamePrefix,
+        postCssPluginOrder
       })
     }, {
       test: /\.jpe?g$|\.gif$|\.png$/,

package/lib/deprecationLogger.js

@@ -0,0 +1,41 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.deprecateMessage = deprecateMessage;
+exports.deprecateOption = deprecateOption;
+exports.deprecationLoggerEnd = deprecationLoggerEnd;
+exports.deprecationLoggerStart = deprecationLoggerStart;
+
+var _logger = require("./logger");
+
+function deprecateMessage(message) {
+  // eslint-disable-next-line no-use-before-define
+  deprecationLoggerStart();
+  (0, _logger.messageLogger)('\x1b[36m%s\x1b[0m', message);
+}
+
+function printLine() {
+  deprecateMessage('\n!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!! \n ');
+}
+
+let isFirstDeprecation = false;
+
+function deprecateOption(previousObjPath = '', newObjPath = '', message = '') {
+  deprecateMessage(`Please move "${previousObjPath.split('.').join(' > ')}" to "${newObjPath.split('.').join(' > ')}" following option ${message}`);
+}
+
+function deprecationLoggerStart() {
+  if (!isFirstDeprecation) {
+    isFirstDeprecation = true;
+    printLine();
+  }
+}
+
+function deprecationLoggerEnd() {
+  if (isFirstDeprecation) {
+    isFirstDeprecation = false;
+    printLine();
+  }
+}

package/lib/loaderUtils/getCSSLoaders.js

@@ -18,6 +18,20 @@ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { de
 const fs = require('fs');
 
 const options = (0, _utils.getOptions)();
+const defaultPostCssPluginOrder = ['valueReplacer', 'selectorReplace', 'hasRTL', 'hoverActive', 'combinerMediaQuery', 'cssVariableReplacement', 'selectorWeight', 'minifier', 'composeMinification'];
+
+function calculatePostCssPluginOrder(postCssPluginOrder, pluginOrder) {
+  // if(typeof postCssPluginOrder === Boolean)
+  if (Array.isArray(postCssPluginOrder)) {
+    return postCssPluginOrder;
+  }
+
+  if (postCssPluginOrder) {
+    return pluginOrder;
+  }
+
+  return defaultPostCssPluginOrder.filter(value => pluginOrder.includes(value));
+}
 
 const getCSSLoaders = optionsObj => {
   const {
@@ -29,7 +43,8 @@ const getCSSLoaders = optionsObj => {
     cssUniqueness,
     selectorReplace,
     cssHashSelectors,
-    classNamePrefix
+    classNamePrefix,
+    postCssPluginOrder
   } = optionsObj;
   const {
     devCssFileBountry
@@ -51,10 +66,11 @@ const getCSSLoaders = optionsObj => {
     cssLoaderOptions.modules.localIdentName = classNameBlob;
   } else {
     cssLoaderOptions.modules.getLocalIdent = (0, _cssClassNameGenerate.default)(cssUniqueness, cssHashSelectors, classNamePrefix, patterns);
-  } // console.log('selector weight config : ', selectorWeightConfig);
+  }
 
+  const pluginOrder = calculatePostCssPluginOrder(postCssPluginOrder, Object.keys(plugins).filter(x => plugins[x] !== false)); // console.log('selector weight config : ', selectorWeightConfig);
 
-  let postcssPlugins = [plugins.valueReplacer && require('../postcss-plugins/ValueReplacer')(valueReplacer), plugins.selectorReplace && require('../postcss-plugins/SelectorReplace')(selectorReplace), plugins.hasRTL && require('@zohodesk/postcss-rtl')({
+  const postcssPlugins = [plugins.valueReplacer && require('../postcss-plugins/ValueReplacer')(valueReplacer), plugins.hasRTL && require('@zohodesk/postcss-rtl')({
     addPrefixToSelector: function addPrefixToSelector(selector, prefix) {
       if (prefix === '[dir]') {
         return selector;
@@ -62,7 +78,7 @@ const getCSSLoaders = optionsObj => {
 
       return `${prefix} ${selector}`; // Make selectors like [dir=rtl] > .selector
     }
-  }), plugins.combinerMediaQuery && require('postcss-combine-media-query')(), plugins.hoverActive && require('../postcss-plugins/hoverActivePlugin')(mediaQueryHoverActiveString), plugins.cssVariableReplacement && fs.existsSync(cssVariableReplacementConfig) && require('../postcss-plugins/variableModificationPlugin/index').plugin(cssVariableReplacementConfig) // ,
+  }), plugins.selectorReplace && require('../postcss-plugins/SelectorReplace')(selectorReplace), plugins.combinerMediaQuery && require('postcss-combine-media-query')(), plugins.hoverActive && require('../postcss-plugins/hoverActivePlugin')(mediaQueryHoverActiveString), plugins.cssVariableReplacement && fs.existsSync(cssVariableReplacementConfig) && require('../postcss-plugins/variableModificationPlugin/index').plugin(cssVariableReplacementConfig) // ,
   // plugins.composeMinification &&
   //   require('../postcss-plugins/composePlugin')()
   ].filter(Boolean);
@@ -141,13 +157,14 @@ const getCSSLoaders = optionsObj => {
           */
         //  console.log(params.resourcePath);
         //  console.log(postcssPlugins);
-        const finalpostcssPlugins = (0, _fileHandling.isFileNameMatchingPattern)({
+        const finalPostcssPlugins = (0, _fileHandling.isFileNameMatchingPattern)({
           filename: params.resourcePath,
           filterObject: patterns,
-          plugins: postcssPlugins
+          plugins: postcssPlugins,
+          order: pluginOrder
         }); // postcssPlugins that are allowed
 
-        return finalpostcssPlugins.length > 0 ? finalpostcssPlugins : [require('../postcss-plugins/EmptyPlugin')()];
+        return finalPostcssPlugins.length > 0 ? finalPostcssPlugins : [require('../postcss-plugins/EmptyPlugin')()];
       }
     }
   } : null, plugins.composeMinification ? {

package/lib/pluginUtils/getDevPlugins.js

@@ -72,7 +72,8 @@ const getDevPlugins = (options, publicPath) => {
       enableRTLSplit
     },
     i18n,
-    unusedFiles
+    unusedFiles,
+    resourceHints
   } = options;
   const hasEFC = newOptionForEnableEFC || prevOptionForEnableEFC;
   const cssLTRFileNameTempalte = enableRTLSplit ? 'css/[name].ltr.css' : 'css/[name].css';
@@ -94,7 +95,7 @@ const getDevPlugins = (options, publicPath) => {
     filename: cssLTRFileNameTempalte,
     // ignoreOrder: true,
     chunkFilename: cssLTRFileNameTempalte
-  }), new _plugins.ResourceHintsPlugin()];
+  }), new _plugins.ResourceHintsPlugin(resourceHints)];
 
   if (enableRTLSplit) {
     pluginsArr.push(new _RtlCssPlugin.RtlCssPlugin({

package/lib/pluginUtils/getProdPlugins.js

@@ -107,7 +107,7 @@ const getProdPlugins = (options, publicPath = '') => {
     // ignoreOrder: true,
     filename: cssLTRFileNameTempalte,
     chunkFilename: cssLTRFileNameTempalte
-  }), new _plugins.ResourceHintsPlugin(), new _plugins.MinifyPlugin()];
+  }), new _plugins.ResourceHintsPlugin(options.resourceHints), new _plugins.MinifyPlugin()];
 
   if (enableRTLSplit) {
     pluginsArr.push(new _RtlCssPlugin.RtlCssPlugin({

package/lib/plugins/ReportGeneratePlugin.js

@@ -13,6 +13,8 @@ var _redis = _interopRequireDefault(require("redis"));
 
 var _utils = require("../utils");
 
+var _log = require("../utils/log");
+
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
 let options = (0, _utils.getOptions)();
@@ -68,10 +70,10 @@ class reportGeneratePlugin {
       let client = _redis.default.createClient(redisPort, redisHost);
 
       client.on('connect', () => {
-        (0, _utils.log)('Redis client connected');
+        (0, _log.log)('Redis client connected');
       });
       client.on('error', err => {
-        (0, _utils.log)(`Something went wrong ${err}`);
+        (0, _log.log)(`Something went wrong ${err}`);
       });
 
       if (_fs.default.existsSync(_path.default.resolve(process.cwd(), 'build', 'stats.json'))) {
@@ -80,7 +82,7 @@ class reportGeneratePlugin {
         statsJSON = JSON.parse(statsJSON);
         let finalObj = {};
         let branchName = branch ? branch : (0, _utils.getCurrentBranch)();
-        (0, _utils.log)(branchName);
+        (0, _log.log)(branchName);
         statsJSON.assets.forEach(assetObj => {
           let nameSplitList = assetObj.name.split('/')[assetObj.name.split('/').length - 1].split('.'); // eslint-disable-line
 
@@ -111,7 +113,7 @@ class reportGeneratePlugin {
             };
             client.get(branchName, (err, reply) => {
               if (err) {
-                (0, _utils.log)(err);
+                (0, _log.log)(err);
               } else {
                 reply = JSON.parse(reply); // eslint-disable-line
 
@@ -147,7 +149,7 @@ class reportGeneratePlugin {
                     throw err;
                   }
 
-                  (0, _utils.log)('Stats Json generated!');
+                  (0, _log.log)('Stats Json generated!');
                 });
               }
             });
@@ -169,7 +171,7 @@ class reportGeneratePlugin {
           }
 
           if (err) {
-            (0, _utils.log)(err);
+            (0, _log.log)(err);
           }
         });
       }