@zohodesk/react-cli 0.0.1-exp.169.1 → 0.0.1-exp.175.0

package/lib/configs/libAlias.js

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.libAlias = void 0;
+exports.libAlias = exports.jestModuleNameMapper = 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,
@@ -27,5 +27,12 @@ const libAlias = {
   '@zohodesk/timetracker/lib': '@zohodesk/timetracker/es',
   '@zohodesk/variables/lib': '@zohodesk/variables/es',
   '@zohodesk/virtualizer/lib': '@zohodesk/virtualizer/es'
-};
-exports.libAlias = libAlias;
+}; //   '^@root(.*)$': '<rootDir>/src$1',
+// '^@components(.*)$': '<rootDir>/src/components$1',
+
+exports.libAlias = libAlias;
+const jestModuleNameMapper = Object.keys(libAlias).reduce((previousValue, key) => {
+  previousValue[`^${key}(.*)$`] = `${libAlias[key]}$1`;
+  return previousValue;
+}, {});
+exports.jestModuleNameMapper = jestModuleNameMapper;

package/lib/configs/resolvers.js

@@ -0,0 +1,38 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.loaderResolver = loaderResolver;
+exports.moduleResolver = moduleResolver;
+
+var _constants = require("../constants");
+
+var _libAlias = require("./libAlias");
+
+function moduleResolver(options) {
+  const {
+    moduleResolvePath,
+    disableES5Transpile
+  } = options.app;
+  const nodeModulesPath = moduleResolvePath ? require(require.resolve(moduleResolvePath, {
+    paths: [options.cwd]
+  })).nodeModulesPath : ''; // const {unstableDepsInverse} = options;
+
+  return {
+    modules: [nodeModulesPath, 'node_modules'].filter(Boolean),
+    alias: disableES5Transpile ? _libAlias.libAlias : {} // alias: { ...libAlias, ...clientDependenies }
+
+  };
+}
+
+function loaderResolver(options) {
+  // const unstableDepsInverse = false;
+  const {
+    unstableDepsInverse
+  } = options;
+  return {
+    modules: unstableDepsInverse ? ['node_modules', _constants.cliNodemodulesPath] : [_constants.cliNodemodulesPath, 'node_modules'] // alias:  libAlias
+
+  };
+}

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

@@ -10,24 +10,23 @@ var _pluginUtils = require("../pluginUtils");
 
 var _loaderUtils = require("../loaderUtils");
 
-var _libAlias = require("./libAlias");
-
 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 {
-  unstableDepsInverse,
+const options = (0, _utils.getOptions)();
+const {
   app: {
     folder,
     context,
     server,
     outputFolder,
-    rtlExclude,
-    combinerMq,
-    hasRTL,
-    hoverActive,
+    plugins,
+    exclude,
+    mediaQueryHoverActiveString,
+    cssVariableReplacementConfig,
     cssUniqueness,
     seperateCssModules,
     changeRuntimeChunkChar,
@@ -36,19 +35,18 @@ let {
     cssHashSelectors,
     classNamePrefix,
     selectorReplace,
-    disableES5Transpile,
     devConsoleExculde,
     sourcemap,
     crossorigin
   }
 } = options;
-let {
+const {
   disableContextURL
 } = server;
-let appPath = process.cwd();
-let contextURL = disableContextURL ? '' : context;
-let serverUrl = (0, _utils.getServerURL)(server, 'https');
-let output = {
+const appPath = process.cwd();
+const contextURL = disableContextURL ? '' : context;
+const serverUrl = (0, _utils.getServerURL)(server, 'https');
+const output = {
   path: _path.default.join(appPath, outputFolder),
   filename: 'js/[name].js',
   chunkFilename: 'js/[name].js',
@@ -87,9 +85,9 @@ module.exports = {
       test: /\.js$/,
       use: (0, _loaderUtils.getDevJsLoaders)(options),
       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;
@@ -100,10 +98,10 @@ module.exports = {
     }, seperateCssModules ? {
       test: /\.css$/,
       exclude: /\.module\.css$/,
-      use: (0, _loaderUtils.getCSSLoaders)(hasRTL, rtlExclude, combinerMq, hoverActive, '[local]', false, null)
+      use: (0, _loaderUtils.getCSSLoaders)(plugins, exclude, mediaQueryHoverActiveString, cssVariableReplacementConfig, '[local]', false, null)
     } : null, {
       test: seperateCssModules ? /\.module\.css$/ : /(\.module)?\.css$/,
-      use: (0, _loaderUtils.getCSSLoaders)(hasRTL, combinerMq, rtlExclude, hoverActive, null, cssUniqueness, selectorReplace, cssHashSelectors, classNamePrefix)
+      use: (0, _loaderUtils.getCSSLoaders)(plugins, exclude, mediaQueryHoverActiveString, cssVariableReplacementConfig, null, cssUniqueness, selectorReplace, cssHashSelectors, classNamePrefix)
     }, (0, _configsAssetsLoaders.configImageLoader)(nameTemplate), (0, _configsAssetsLoaders.configFontLoader)(nameTemplate), (0, _configsAssetsLoaders.configSVGLoader)(nameTemplate), (0, _configsAssetsLoaders.configVideoLoader)(nameTemplate), (0, _configsAssetsLoaders.configAudioLoader)(nameTemplate), {
       test: /\.tmpl$/,
       use: [{
@@ -126,11 +124,6 @@ module.exports = {
   externals: {
     ZC: '$ZC'
   },
-  resolve: {
-    modules: unstableDepsInverse ? ['node_modules', _path.default.resolve(__dirname, '..', '..', 'node_modules')] : [_path.default.resolve(__dirname, '..', '..', 'node_modules'), 'node_modules'],
-    alias: disableES5Transpile ? _libAlias.libAlias : {}
-  },
-  resolveLoader: {
-    modules: unstableDepsInverse ? ['node_modules', _path.default.resolve(__dirname, '..', '..', 'node_modules')] : [_path.default.resolve(__dirname, '..', '..', 'node_modules'), 'node_modules']
-  }
+  resolve: (0, _resolvers.moduleResolver)(options),
+  resolveLoader: (0, _resolvers.loaderResolver)(options)
 };

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

@@ -8,24 +8,22 @@ var _pluginUtils = require("../pluginUtils");
 
 var _loaderUtils = require("../loaderUtils");
 
-var _libAlias = require("./libAlias");
-
 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 {
-  unstableDepsInverse,
+const options = (0, _utils.getOptions)();
+const {
   docs: {
     componentFolder,
-    disableES5Transpile,
     enableChunkHash,
     cssUniqueness,
-    combinerMq,
-    hasRTL,
-    hoverActive,
-    rtlExclude,
+    plugins,
+    exclude,
+    mediaQueryHoverActiveString,
+    cssVariableReplacementConfig,
     cssHashSelectors,
     classNamePrefix
   },
@@ -33,7 +31,7 @@ let {
     folder
   }
 } = options;
-let appPath = process.cwd();
+const appPath = process.cwd();
 const nameTemplate = (0, _configsAssetsLoaders.createNameTemplate)(enableChunkHash);
 
 module.exports = isSSTest => ({
@@ -75,7 +73,7 @@ module.exports = isSSTest => ({
       exclude: /node_modules/
     }, {
       test: /(\.module)?\.css$/,
-      use: (0, _loaderUtils.getCSSLoaders)(hasRTL, combinerMq, rtlExclude, hoverActive, false, cssUniqueness, null, cssHashSelectors, classNamePrefix)
+      use: (0, _loaderUtils.getCSSLoaders)(plugins, exclude, mediaQueryHoverActiveString, cssVariableReplacementConfig, false, cssUniqueness, null, cssHashSelectors, classNamePrefix)
     }, (0, _configsAssetsLoaders.configImageLoader)(nameTemplate), (0, _configsAssetsLoaders.configFontLoader)(nameTemplate), (0, _configsAssetsLoaders.configSVGLoader)(nameTemplate), (0, _configsAssetsLoaders.configAudioLoader)(nameTemplate), (0, _configsAssetsLoaders.configVideoLoader)(nameTemplate), {
       test: /\.html$/,
       use: {
@@ -104,11 +102,6 @@ module.exports = isSSTest => ({
   externals: {
     ZC: '$ZC'
   },
-  resolve: {
-    modules: unstableDepsInverse ? ['node_modules', _path.default.resolve(__dirname, '..', '..', 'node_modules')] : [_path.default.resolve(__dirname, '..', '..', 'node_modules'), 'node_modules'],
-    alias: disableES5Transpile ? _libAlias.libAlias : {}
-  },
-  resolveLoader: {
-    modules: unstableDepsInverse ? ['node_modules', _path.default.resolve(__dirname, '..', '..', 'node_modules')] : [_path.default.resolve(__dirname, '..', '..', 'node_modules'), 'node_modules']
-  }
+  resolve: (0, _resolvers.moduleResolver)(options),
+  resolveLoader: (0, _resolvers.loaderResolver)(options)
 });

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

@@ -10,17 +10,19 @@ var _getLibraryImactPlugins = _interopRequireDefault(require("../pluginUtils/get
 
 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 {
+const options = (0, _utils.getOptions)();
+const {
   docs: {
     componentFolder,
     cssUniqueness,
-    hasRTL,
-    rtlExclude,
-    hoverActive,
-    combinerMq,
+    plugins,
+    exclude,
+    mediaQueryHoverActiveString,
+    cssVariableReplacementConfig,
     cssHashSelectors,
     enableChunkHash,
     classNamePrefix
@@ -29,7 +31,7 @@ let {
     folder
   }
 } = options;
-let appPath = process.cwd();
+const appPath = process.cwd();
 const nameTemplate = (0, _configsAssetsLoaders.createNameTemplate)(enableChunkHash);
 module.exports = {
   entry: {
@@ -38,6 +40,7 @@ module.exports = {
   },
   devtool: 'none',
   mode: 'development',
+  stats: 'errors-only',
   output: {
     path: _path.default.join(appPath, 'build'),
     filename: 'js/[name].js',
@@ -70,7 +73,7 @@ module.exports = {
       exclude: /node_modules/
     }, {
       test: /(\.module)?\.css$/,
-      use: (0, _loaderUtils.getCSSLoaders)(hasRTL, rtlExclude, combinerMq, hoverActive, false, cssUniqueness, null, cssHashSelectors, classNamePrefix)
+      use: (0, _loaderUtils.getCSSLoaders)(plugins, exclude, mediaQueryHoverActiveString, cssVariableReplacementConfig, false, cssUniqueness, null, cssHashSelectors, classNamePrefix)
     }, (0, _configsAssetsLoaders.configImageLoader)(nameTemplate), (0, _configsAssetsLoaders.configFontLoader)(nameTemplate), (0, _configsAssetsLoaders.configSVGLoader)(nameTemplate), (0, _configsAssetsLoaders.configAudioLoader)(nameTemplate), (0, _configsAssetsLoaders.configVideoLoader)(nameTemplate), {
       test: /\.html$/,
       use: {
@@ -100,11 +103,6 @@ module.exports = {
   externals: {
     ZC: '$ZC'
   },
-  resolve: {
-    modules: [_path.default.resolve(__dirname, '..', '..', 'node_modules'), 'node_modules']
-  },
-  resolveLoader: {
-    modules: [_path.default.resolve(__dirname, '..', '..', 'node_modules'), 'node_modules']
-  },
-  stats: 'errors-only'
+  resolve: (0, _resolvers.moduleResolver)(options),
+  resolveLoader: (0, _resolvers.loaderResolver)(options)
 };

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

@@ -10,29 +10,27 @@ var _pluginUtils = require("../pluginUtils");
 
 var _loaderUtils = require("../loaderUtils");
 
-var _libAlias = require("./libAlias");
-
 var _configsAssetsLoaders = require("../loaderUtils/configsAssetsLoaders");
 
+var _resolvers = require("./resolvers");
+
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
 // import TerserPlugin from 'terser-webpack-plugin';
-let options = (0, _utils.getOptions)();
-let {
-  unstableDepsInverse,
+const options = (0, _utils.getOptions)();
+const {
   app: {
     folder,
     context,
-    enableChunkHash,
     outputFolder,
     disableES5Transpile,
     removeAttribute,
     enableSMap,
     server,
-    combinerMq,
-    hasRTL,
-    rtlExclude,
-    hoverActive,
+    plugins,
+    exclude,
+    mediaQueryHoverActiveString,
+    cssVariableReplacementConfig,
     cssUniqueness,
     server: {
       mode
@@ -47,10 +45,13 @@ let {
     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',
@@ -63,15 +64,15 @@ if (crossorigin) {
 }
 
 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',
@@ -135,9 +136,9 @@ module.exports = {
       }].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;
@@ -148,10 +149,10 @@ module.exports = {
     }, seperateCssModules ? {
       test: /\.css$/,
       exclude: /\.module\.css$/,
-      use: (0, _loaderUtils.getCSSLoaders)(hasRTL, rtlExclude, hoverActive, combinerMq, '[local]', false, null)
+      use: (0, _loaderUtils.getCSSLoaders)(plugins, exclude, cssVariableReplacementConfig, mediaQueryHoverActiveString, '[local]', false, null)
     } : null, {
       test: seperateCssModules ? /\.module\.css$/ : /\.css$/,
-      use: (0, _loaderUtils.getCSSLoaders)(hasRTL, combinerMq, rtlExclude, hoverActive, false, cssUniqueness, selectorReplace, cssHashSelectors, classNamePrefix)
+      use: (0, _loaderUtils.getCSSLoaders)(plugins, exclude, mediaQueryHoverActiveString, cssVariableReplacementConfig, false, cssUniqueness, selectorReplace, cssHashSelectors, classNamePrefix)
     }, {
       test: /\.jpe?g$|\.gif$|\.png$/,
       use: [{
@@ -212,11 +213,6 @@ module.exports = {
   externals: {
     ZC: '$ZC'
   },
-  resolve: {
-    modules: unstableDepsInverse ? ['node_modules', _path.default.resolve(__dirname, '..', '..', 'node_modules')] : [_path.default.resolve(__dirname, '..', '..', 'node_modules'), 'node_modules'],
-    alias: disableES5Transpile ? _libAlias.libAlias : {}
-  },
-  resolveLoader: {
-    modules: unstableDepsInverse ? ['node_modules', _path.default.resolve(__dirname, '..', '..', 'node_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,30 @@ 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`);
 

package/lib/loaderUtils/getCSSLoaders.js

@@ -13,10 +13,27 @@ var _utils = require("../utils");
 
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
-let options = (0, _utils.getOptions)();
-let isWin = process.platform === 'win32';
+const fs = require('fs');
 
-let getCSSLoaders = (hasRTL, combinerMq, rtlExclude, hoverActive, classNameBlob, cssUniqueness, selectorReplace, cssHashSelectors, classNamePrefix) => {
+const options = (0, _utils.getOptions)();
+const isWin = process.platform === 'win32';
+
+function windowsModification(array) {
+  return isWin ? array.map(r => r.replace(/\//g, '\\')) : array;
+}
+
+function excludeEmptyCheckPlugin({
+  enable,
+  ignore,
+  plugins
+}) {
+  return enable ? ignore.length === 0 ? plugins : [require('../postcss-plugins/ExcludePlugin')({
+    ignore,
+    plugins
+  })] : [];
+}
+
+const getCSSLoaders = (plugins, exclude, mediaQueryHoverActiveString, cssVariableReplacementConfig, classNameBlob, cssUniqueness, selectorReplace, cssHashSelectors, classNamePrefix) => {
   const {
     devCssFileBountry
   } = options.app;
@@ -26,8 +43,11 @@ let getCSSLoaders = (hasRTL, combinerMq, rtlExclude, hoverActive, classNameBlob,
   const {
     cssSelectorZipPath
   } = options.impactService;
-  let rtlExcludeLocal = isWin ? rtlExclude.map(r => r.replace(/\//g, '\\')) : rtlExclude;
-  let cssLoaderOptions = {
+  const rtlExcludeLocal = windowsModification(exclude.rtl);
+  const hoverActiveExcludeLocal = windowsModification(exclude.hoverActive);
+  const combinerMediaQueryExcludeLocal = windowsModification(exclude.combinerMediaQuery);
+  const cssVariableReplacementExcludeLocal = windowsModification(exclude.cssVariableReplacement);
+  const cssLoaderOptions = {
     // importLoaders: hasRTL||hoverActive ? 1 : 0,
     importLoaders: 1,
     modules: {},
@@ -40,7 +60,13 @@ let getCSSLoaders = (hasRTL, combinerMq, rtlExclude, hoverActive, classNameBlob,
     cssLoaderOptions.modules.getLocalIdent = (0, _cssClassNameGenerate.default)(cssUniqueness, cssHashSelectors, classNamePrefix);
   }
 
-  const postcssPlugins = [valueReplacer && require('../postcss-plugins/ValueReplacer')(valueReplacer), selectorReplace && require('postcss-selector-replace')(selectorReplace), hasRTL && require('../postcss-plugins/ExcludeRTLPlugin')({
+  const postcssPlugins = [valueReplacer && require('../postcss-plugins/ValueReplacer')(valueReplacer), selectorReplace && require('postcss-selector-replace')(selectorReplace), // ...excludeEmptyCheckPlugin({
+  //   enable: true,
+  //   ignore: [],
+  //   plugins: [require('../postcss-plugins/variablePropertiesCollector').default()]
+  // }),
+  ...excludeEmptyCheckPlugin({
+    enable: plugins.hasRTL,
     ignore: rtlExcludeLocal,
     plugins: [require('@zohodesk/postcss-rtl')({
       addPrefixToSelector: function addPrefixToSelector(selector, prefix) {
@@ -51,8 +77,19 @@ let getCSSLoaders = (hasRTL, combinerMq, rtlExclude, hoverActive, classNameBlob,
         return `${prefix} ${selector}`; // Make selectors like [dir=rtl] > .selector
       }
     })]
-  }), // require('postcss-import')(),
-  combinerMq && require('postcss-combine-media-query')(), hoverActive && require('../postcss-plugins/hoverActivePlugin')()].filter(Boolean);
+  }), ...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')(cssVariableReplacementConfig)]
+  })].filter(Boolean);
   return [cssSelectorZipPath && {
     loader: require.resolve('../loaders/selectorMappingLoader')
   }, {

package/lib/pluginUtils/configHtmlWebpackPlugins.js

@@ -0,0 +1,59 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.configHtmlWebpackPlugins = configHtmlWebpackPlugins;
+
+var _path = _interopRequireDefault(require("path"));
+
+var _htmlWebpackPlugin = _interopRequireDefault(require("html-webpack-plugin"));
+
+var _htmlWebpackInjectAttributesPlugin = _interopRequireDefault(require("html-webpack-inject-attributes-plugin"));
+
+var _common = require("../common");
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+const defaultHTMLMiniFyOption = {
+  collapseWhitespace: true,
+  minifyCSS: true,
+  minifyJS: true,
+  keepClosingSlash: true,
+  removeComments: false,
+  removeRedundantAttributes: true,
+  removeScriptTypeAttributes: true,
+  removeStyleLinkTypeAttributes: true,
+  useShortDoctype: true
+};
+
+function configHtmlWebpackPlugins(plugins, {
+  enableChunkHash = false,
+  folder,
+  inject,
+  crossorigin,
+  hasEFC,
+  minify: minifyHtmlOptions = false
+}) {
+  const optionsHtmlWebpack = {
+    chunksSortMode: 'none',
+    filename: enableChunkHash ? 'index.[templatehash:20].html' : 'index.html',
+    template: _path.default.join(process.cwd(), folder, 'index.html'),
+    minify: minifyHtmlOptions === true ? defaultHTMLMiniFyOption : minifyHtmlOptions === null ? false : minifyHtmlOptions,
+    // : typeof minifyHtmlOptions === 'object'
+    // ? minifyHtmlOptions
+    // : minifyHtmlOptions,,
+    templateParameters: _common.templateParameters,
+    scriptLoading: 'defer',
+    inject: inject
+  };
+
+  if (hasEFC) {
+    optionsHtmlWebpack.excludeChunks = ['efc', 'widget'];
+  }
+
+  plugins.push(new _htmlWebpackPlugin.default(optionsHtmlWebpack));
+  crossorigin && plugins.push(new _htmlWebpackInjectAttributesPlugin.default({
+    crossorigin: 'anonymous'
+  }));
+}