@zohodesk/react-cli 0.0.1-beta.99 → 0.0.1-betaa.138.2

package/files/eslintrc.js

@@ -0,0 +1,57 @@
+const [off, , error] = ['off', 'warn', 'error'];
+
+module.exports = {
+  env: {
+    browser: true,
+    es2021: true,
+  },
+  extends: ['plugin:react/recommended', 'airbnb', 'prettier'],
+  parserOptions: {
+    ecmaFeatures: {
+      jsx: true,
+    },
+    ecmaVersion: 12,
+    sourceType: 'module',
+  },
+  plugins: [
+    'react',
+    'css-modules',
+    '@zohodesk/zsecurity',
+    '@zohodesk/react-performance',
+  ],
+  rules: {
+    // Internal Rules
+    '@zohodesk/react-performance/no-ref-mapstatetoprops': error,
+    '@zohodesk/zsecurity/no-unsecure-html': error,
+    '@zohodesk/zsecurity/no-protocol-check': error,
+
+    // CSS Module Rules
+    'css-modules/no-unused-class': [error, { camelCase: true }],
+    'css-modules/no-undef-class': [error, { camelCase: 'only' }],
+
+    'import/no-unresolved': off,
+    'import/no-extraneous-dependencies': off,
+
+    // As redux used
+    'no-shadow': off, // As we import the action files and use the same name in getting from props built from connect.
+    'react/jsx-filename-extension': off,
+
+    // As we don't follow
+    'react/require-default-props': off,
+    'react/jsx-props-no-spreading': off,
+
+    // As we didn't update
+    'react/jsx-fragments': off,
+
+    // Not needed
+    'no-plusplus': off,
+    'no-unused-expressions': [
+      error,
+      {
+        allowShortCircuit: true,
+        allowTernary: true,
+      },
+    ],
+    'react/jsx-no-target-blank': error,
+  },
+};

package/files/prettierrc.js

@@ -0,0 +1,3 @@
+module.exports = {
+  trailingComma: 'none',
+};

package/lib/babel/cmjs-plugins-presets.js

@@ -1,17 +1,24 @@
-'use strict';
+"use strict";
 
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
+exports.default = void 0;
 
-var _utils = require('../utils');
+var _utils = require("../utils");
 
-var _getOptions = (0, _utils.getOptions)(),
-    mode = _getOptions.module.mode;
+let {
+  module: {
+    mode
+  }
+} = (0, _utils.getOptions)();
+let isProd = mode.toLowerCase() === 'prod';
 
-var isProd = mode.toLowerCase() === 'prod';
+var _default = () => ({
+  presets: [require.resolve('@babel/preset-env'), require.resolve('@babel/preset-react')],
+  plugins: [[require.resolve('babel-plugin-transform-define'), isProd ? {
+    __DOCS__: false
+  } : {}]]
+});
 
-exports.default = {
-  presets: ['env', 'react'],
-  plugins: [['transform-define', isProd ? { __DOCS__: false } : {}], 'syntax-dynamic-import']
-};
+exports.default = _default;

package/lib/babel/es-plugins-presets.js

@@ -1,22 +1,34 @@
-'use strict';
+"use strict";
 
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
+exports.default = void 0;
 
-var _utils = require('../utils');
+var _utils = require("../utils");
 
-var _getOptions = (0, _utils.getOptions)(),
-    mode = _getOptions.module.mode;
+let {
+  module: {
+    mode,
+    disableES5Transpile
+  }
+} = (0, _utils.getOptions)();
+let isProd = mode.toLowerCase() === 'prod';
 
-var isProd = mode.toLowerCase() === 'prod';
+var _default = () => ({
+  presets: [[require.resolve('@babel/preset-env'), disableES5Transpile ? {
+    modules: false,
+    useBuiltIns: 'usage',
+    corejs: 3,
+    targets: {
+      browsers: ['last 3 Chrome versions', 'last 3 Firefox versions', 'last 3 Edge versions', 'last 3 Safari versions']
+    }
+  } : {
+    modules: false
+  }], require.resolve('@babel/preset-react')],
+  plugins: [[require.resolve('babel-plugin-transform-define'), isProd ? {
+    __DOCS__: false
+  } : {}], require.resolve('@babel/plugin-syntax-dynamic-import')]
+});
 
-exports.default = {
-  presets: [['env', { modules: false }], 'react'],
-  plugins: [['transform-runtime', {
-    helpers: true,
-    polyfill: true,
-    regenerator: false,
-    moduleName: 'babel-runtime'
-  }], ['transform-define', isProd ? { __DOCS__: false } : {}], 'syntax-dynamic-import']
-};
+exports.default = _default;

package/lib/common/getEntries.js

@@ -1,43 +1,52 @@
-'use strict';
+"use strict";
 
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
+exports.default = void 0;
 
-var _path = require('path');
+var _path = _interopRequireDefault(require("path"));
 
-var _path2 = _interopRequireDefault(_path);
-
-var _utils = require('../utils');
+var _utils = require("../utils");
 
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
-var getEntries = function getEntries(appSchemas, mode) {
-  var appPath = process.cwd();
-  var _appSchemas$app = appSchemas.app,
-      isReactMig = _appSchemas$app.isReactMig,
-      hasWidget = _appSchemas$app.hasWidget,
-      hasEFC = _appSchemas$app.hasEFC,
-      server = _appSchemas$app.server,
-      folder = _appSchemas$app.folder;
-
-
-  var mainJs = [];
-  var entry = { main: mainJs };
+let getEntries = (appSchemas, mode) => {
+  let appPath = process.cwd();
+  let {
+    isReactMig,
+    hasWidget,
+    server,
+    folder
+  } = appSchemas.app;
+  const {
+    hasEFC: prevOptionForEnableEFC
+  } = appSchemas.app;
+  const {
+    hasEFC: newOptionForEnableEFC
+  } = appSchemas.efc;
+  const hasEFC = newOptionForEnableEFC || prevOptionForEnableEFC;
+  let mainJs = [];
+  let entry = {
+    main: mainJs
+  };
 
   if (mode === 'dev' || mode === 'dev-no-warn') {
-    mainJs.push(_path2.default.join(__dirname, '..', 'templates', 'WMSTemplate') + '?wmsPath=wss:' + (0, _utils.getServerURL)(server));
+    mainJs.push(`${_path.default.join(__dirname, '..', 'templates', 'WMSTemplate')}?wmsPath=wss:${(0, _utils.getServerURL)(server)}`);
   }
 
-  mainJs.push(_path2.default.join(appPath, folder, isReactMig ? 'migration.js' : 'index.js'));
+  mainJs.push(_path.default.join(appPath, folder, isReactMig ? 'migration.js' : 'index.js'));
 
   if (hasWidget) {
-    entry.widget = [_path2.default.join(appPath, folder, 'widget.js')];
+    entry.widget = [_path.default.join(appPath, folder, 'widget.js')];
   }
+
   if (hasEFC) {
-    entry.efc = [_path2.default.join(appPath, folder, 'efc.js')];
+    entry.efc = [_path.default.join(appPath, folder, 'efc.js')];
   }
 
   return entry;
 };
-exports.default = getEntries;
+
+var _default = getEntries;
+exports.default = _default;

package/lib/common/getPublicPathConfig.js

@@ -1,26 +1,40 @@
-'use strict';
+"use strict";
 
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
+exports.default = void 0;
 
-var _utils = require('../utils');
+var _utils = require("../utils");
 
-var _getOptions = (0, _utils.getOptions)(),
-    _getOptions$app = _getOptions.app,
-    publicPaths = _getOptions$app.publicPaths,
-    mode = _getOptions$app.server.mode;
+let {
+  app: {
+    publicPaths,
+    cdnMapping: {
+      isCdnEnabled,
+      variableName
+    },
+    server: {
+      mode
+    }
+  }
+} = (0, _utils.getOptions)();
+let isDevelopment = mode === 'dev' || mode === 'prod' || mode === 'dev-no-warn';
 
-var isDevelopment = mode === 'dev' || mode === 'prod' || mode === 'dev-no-warn';
+var _default = url => {
+  let type = (0, _utils.getFileType)(url);
 
-exports.default = function (url) {
-  var type = (0, _utils.getFileType)(url);
   if (!isDevelopment) {
     if (publicPaths && publicPaths.callback) {
-      return publicPaths.callback + '(' + JSON.stringify(type) + ') + ' + JSON.stringify(url);
+      return `${publicPaths.callback}(${JSON.stringify(type)}) + ${JSON.stringify(url)}`;
+    } else if (isCdnEnabled) {
+      return `window["${variableName}"] + ${JSON.stringify(url)}`;
     } else if (publicPaths) {
-      return '__REACT_CLI_' + type.toUpperCase() + '_PUBLIC_PATH__ + ' + JSON.stringify(url);
+      return `__REACT_CLI_${type.toUpperCase()}_PUBLIC_PATH__ + ${JSON.stringify(url)}`;
     }
   }
-  return '__webpack_public_path__ + ' + JSON.stringify(url);
-};
+
+  return `__webpack_public_path__ + ${JSON.stringify(url)}`;
+};
+
+exports.default = _default;

package/lib/common/index.js

@@ -1,43 +1,39 @@
-'use strict';
+"use strict";
 
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-
-var _splitChunks = require('./splitChunks');
-
-Object.defineProperty(exports, 'splitChunks', {
+Object.defineProperty(exports, "getEntries", {
   enumerable: true,
-  get: function get() {
-    return _interopRequireDefault(_splitChunks).default;
+  get: function () {
+    return _getEntries.default;
   }
 });
-
-var _getEntries = require('./getEntries');
-
-Object.defineProperty(exports, 'getEntries', {
+Object.defineProperty(exports, "getPublicPathConfig", {
   enumerable: true,
-  get: function get() {
-    return _interopRequireDefault(_getEntries).default;
+  get: function () {
+    return _getPublicPathConfig.default;
   }
 });
-
-var _getPublicPathConfig = require('./getPublicPathConfig');
-
-Object.defineProperty(exports, 'getPublicPathConfig', {
+Object.defineProperty(exports, "splitChunks", {
   enumerable: true,
-  get: function get() {
-    return _interopRequireDefault(_getPublicPathConfig).default;
+  get: function () {
+    return _splitChunks.default;
   }
 });
-
-var _templateParameters = require('./templateParameters');
-
-Object.defineProperty(exports, 'templateParameters', {
+Object.defineProperty(exports, "templateParameters", {
   enumerable: true,
-  get: function get() {
-    return _interopRequireDefault(_templateParameters).default;
+  get: function () {
+    return _templateParameters.default;
   }
 });
 
+var _splitChunks = _interopRequireDefault(require("./splitChunks"));
+
+var _getEntries = _interopRequireDefault(require("./getEntries"));
+
+var _getPublicPathConfig = _interopRequireDefault(require("./getPublicPathConfig"));
+
+var _templateParameters = _interopRequireDefault(require("./templateParameters"));
+
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }

package/lib/common/splitChunks.js

@@ -1,69 +1,78 @@
-'use strict';
+"use strict";
 
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
+exports.default = void 0;
 
-var _path = require('path');
+var _path = _interopRequireDefault(require("path"));
 
-var _path2 = _interopRequireDefault(_path);
+var _utils = require("../utils");
 
-var _utils = require('../utils');
+var _os = _interopRequireDefault(require("os"));
 
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
-function _toConsumableArray(arr) { if (Array.isArray(arr)) { for (var i = 0, arr2 = Array(arr.length); i < arr.length; i++) { arr2[i] = arr[i]; } return arr2; } else { return Array.from(arr); } }
-
-var ps = _path2.default.sep;
-var options = (0, _utils.getOptions)();
-var vendorExclude = options.app.vendorExclude;
-
-
-var isVendor = function isVendor(module) {
-  var userRequest = module.userRequest;
-
-  var excludeList = ['script-loader', 'raw-loader', 'react', 'react-dom'];
+let isWindows = _os.default.platform().toLowerCase() === 'win32';
+let ps = _path.default.sep;
+let options = (0, _utils.getOptions)();
+let {
+  app: {
+    vendorExclude,
+    customChunks
+  }
+} = options;
 
-  excludeList = [].concat(_toConsumableArray(excludeList), _toConsumableArray(vendorExclude));
-  return userRequest && userRequest.indexOf('node_modules') >= 0 && userRequest.endsWith('.css') === false && userRequest.endsWith('publicPathConfig.js') === false && excludeList.every(function (item) {
-    return userRequest.indexOf('node_modules' + ps + item + ps) === -1;
-  });
+let isVendor = function isVendor(module) {
+  let {
+    userRequest
+  } = module;
+  let excludeList = ['script-loader', 'raw-loader', 'react', 'react-dom'];
+  excludeList = [...excludeList, ...vendorExclude];
+  return userRequest && 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);
 };
 
-var isReact = function isReact(module) {
-  var userRequest = module.userRequest;
-
-  var reactBundle = ['react', 'react-dom'];
-  return userRequest && reactBundle.some(function (pkg) {
-    return userRequest.indexOf('node_modules' + ps + pkg + ps) >= 0;
-  });
+let isReact = module => {
+  let {
+    userRequest
+  } = module;
+  let reactBundle = ['react', 'react-dom'];
+  return userRequest && reactBundle.some(pkg => userRequest.indexOf(`node_modules${ps}${pkg}${ps}`) >= 0);
 };
 
-exports.default = {
-  cacheGroups: {
-    default: false,
-    vendors: false,
-    'react.vendor': {
-      name: 'react.vendor',
-      chunks: 'all',
-      minChunks: 1,
-      test: isReact,
-      priority: -10
-    },
-    vendor: {
-      name: 'vendor',
-      chunks: 'all',
-      minChunks: 1,
-      test: isVendor,
-      priority: -10
-    },
-    styles: {
-      name: 'styles',
-      test: /\.css$/,
-      chunks: 'all',
-      enforce: true, // force css in new chunks (ignores all other options)
-      minChunks: 2,
-      priority: -20
-    }
+let defaultChunks = {
+  'react.vendor': {
+    name: 'react.vendor',
+    chunks: 'all',
+    minChunks: 1,
+    test: isReact,
+    priority: -10
+  },
+  vendor: {
+    name: 'vendor',
+    chunks: 'all',
+    minChunks: 1,
+    test: isVendor,
+    priority: -10
   }
-};
+};
+let customChunksConfig = {};
+customChunks.map(({
+  name,
+  pattern,
+  size = 2
+}, index) => customChunksConfig[name] = {
+  name,
+  test: new RegExp(isWindows ? pattern.replace(/\//g, '\\') : pattern),
+  chunks: 'all',
+  enforce: true,
+  minChunks: size,
+  priority: -10 * (index + 2)
+});
+var _default = {
+  cacheGroups: Object.assign({
+    default: false,
+    vendors: false
+  }, defaultChunks, customChunksConfig)
+};
+exports.default = _default;

package/lib/common/templateParameters.js

@@ -1,23 +1,25 @@
-'use strict';
+"use strict";
 
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
+exports.default = void 0;
 
-exports.default = function (compilation, assets, assetTags, options) {
-  Object.keys(assetTags).forEach(function (rootTag) {
-    assetTags[rootTag].forEach(function (tag) {
+var _default = (compilation, assets, assetTags, options) => {
+  Object.keys(assetTags).forEach(rootTag => {
+    assetTags[rootTag].forEach(tag => {
       tag.attributes.nonce = '{{--CSP-nonce}}';
     });
   });
-
   return {
-    compilation: compilation,
+    compilation,
     webpackConfig: compilation.options,
     htmlWebpackPlugin: {
       tags: assetTags,
       files: assets,
-      options: options
+      options
     }
   };
-};
+};
+
+exports.default = _default;

package/lib/configs/jest.config.js

@@ -1,28 +1,25 @@
-'use strict';
+"use strict";
 
-var _path = require('path');
-
-var _path2 = _interopRequireDefault(_path);
+var _path = _interopRequireDefault(require("path"));
 
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
-var appPath = process.cwd();
-
-var commonConfig = {
+let appPath = process.cwd();
+let commonConfig = {
   coverageReporters: ['json', 'html', 'json-summary', 'text'],
   collectCoverage: true,
-  moduleDirectories: [_path2.default.resolve(__dirname, '..', '..', 'node_modules'), 'node_modules'],
+  moduleDirectories: [_path.default.resolve(__dirname, '..', '..', 'node_modules'), 'node_modules'],
   transform: {
-    '^.+\\.(js|jsx)$': _path2.default.resolve(__dirname, '..', 'jest', 'preProcessors', 'jsPreprocessor.js'),
-    '^.+\\.css$': _path2.default.resolve(__dirname, '..', 'jest', 'preProcessors', 'cssPreprocessor.js'),
-    '^(?!.*\\.(js|jsx|css|json)$)': _path2.default.resolve(__dirname, '..', 'jest', 'preProcessors', 'otherFilesPreprocessor.js')
+    '^.+\\.(js|jsx)$': _path.default.resolve(__dirname, '..', 'jest', 'preProcessors', 'jsPreprocessor.js'),
+    '^.+\\.css$': _path.default.resolve(__dirname, '..', 'jest', 'preProcessors', 'cssPreprocessor.js'),
+    '^(?!.*\\.(js|jsx|css|json)$)': _path.default.resolve(__dirname, '..', 'jest', 'preProcessors', 'otherFilesPreprocessor.js')
   },
   moduleNameMapper: {
     '\\.(css|less)$': 'identity-obj-proxy'
   },
   transformIgnorePatterns: ['/node_modules.*?.js$'],
   moduleFileExtensions: ['js'],
-  setupFiles: [_path2.default.resolve(appPath, '__testUtils__', 'globals.js'), _path2.default.resolve(__dirname, '..', 'jest', 'setup.js')],
+  setupFiles: [_path.default.resolve(appPath, '__testUtils__', 'globals.js'), _path.default.resolve(__dirname, '..', 'jest', 'setup.js')],
   globals: {
     __DEVELOPMENT__: true,
     __DOCS__: false,
@@ -30,20 +27,13 @@ var commonConfig = {
   }
 };
 
-module.exports = function () {
-  for (var _len = arguments.length, args = Array(_len), _key = 0; _key < _len; _key++) {
-    args[_key] = arguments[_key];
-  }
-
-  var appFolder = args[0],
-      _args$ = args[1],
-      forCommittedFiles = _args$ === undefined ? false : _args$;
-
+module.exports = (...args) => {
+  let [appFolder, forCommittedFiles = false] = args;
 
   if (forCommittedFiles) {
     return Object.assign({}, commonConfig, {
-      coverageDirectory: _path2.default.resolve(appPath, 'commitCoverage'),
-      testResultsProcessor: _path2.default.resolve(__dirname, '..', 'jest', 'commitedFilesResult.js')
+      coverageDirectory: _path.default.resolve(appPath, 'commitCoverage'),
+      testResultsProcessor: _path.default.resolve(__dirname, '..', 'jest', 'commitedFilesResult.js')
     });
   }
 
@@ -51,8 +41,8 @@ module.exports = function () {
     rootDir: appPath,
     testPathIgnorePatterns: ['/node_modules/', 'docs'],
     unmockedModulePathPatterns: ['__tests__', 'node_modules', '.*'],
-    roots: ['<rootDir>/' + appFolder + '/'],
+    roots: [`<rootDir>/${appFolder}/`],
     testRegex: '(/__tests__/.*|\\.(test|spec))\\.(jsx|js|json|node)$',
-    testResultsProcessor: _path2.default.resolve(__dirname, '..', 'jest', 'result.js')
+    testResultsProcessor: _path.default.resolve(__dirname, '..', 'jest', 'result.js')
   });
 };