@zohodesk/react-cli 0.0.1-beta.16 → 0.0.1-beta.160

package/lib/plugins/ModuleStatsPlugin.js

@@ -1,123 +1,124 @@
-'use strict';
+"use strict";
 
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
+exports.default = void 0;
 
-var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+var _path = _interopRequireDefault(require("path"));
 
-function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+var _webpackSources = require("webpack-sources");
 
-var ModuleStatsPlugin = function () {
-  function ModuleStatsPlugin() {
-    var options = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
-    _classCallCheck(this, ModuleStatsPlugin);
+let isValidModule = name => {
+  if (name.includes('node_modules') && (name.includes(`@zohodesk${_path.default.sep}components`) || name.includes(`@zohodesk${_path.default.sep}dot`) || name.includes(`@zohodesk${_path.default.sep}icons`) || name.includes(`@zohodesk${_path.default.sep}svg`)) && !name.endsWith('docs.js')) {
+    return true;
+  }
 
-    this.options = options;
-    this.options.filename = options.filename || 'moduleStats.js';
+  return !name.includes('index.js') && !name.endsWith('.css') && !name.endsWith('.png') && !name.includes('node_modules') && name.includes('src');
+};
+
+let getModuleName = modulePath => {
+  let [name] = _path.default.parse(modulePath).name.split('.');
+
+  if (modulePath.includes(`@zohodesk${_path.default.sep}components`)) {
+    name = `@zohodesk/components/${name}`;
+  } else if (modulePath.includes(`@zohodesk${_path.default.sep}dot`)) {
+    name = `@zohodesk/dot/${name}`;
   }
 
-  _createClass(ModuleStatsPlugin, [{
-    key: 'apply',
-    value: function apply(compiler) {
-      var _this = this;
-
-      compiler.hooks.emit.tap('ModuleStatsPlugin', function (compilation) {
-        var stats = compilation.getStats().toJson();
-
-        var modules = stats.modules;
-
-        var moduleName = '';
-        var rModuleName = '';
-        var rReferencesArray = [];
-        var rReferencedByArray = [];
-        var data = { results: [] };
-        var moduleDetails = {};
-        var references = '';
-        var referencedBy = '';
-        // let normalizedData = '';
-        var dre = void 0;
-
-        // eslint-disable-next-line guard-for-in
-        for (var i in modules) {
-          moduleName = modules[i].name;
-          if (moduleName.startsWith('./src') && !(moduleName.indexOf('index.js') > -1) && !moduleName.endsWith('css')) {
-            rModuleName = moduleName.substring(moduleName.lastIndexOf('/') + 1, moduleName.lastIndexOf('.'));
-            if (rModuleName.endsWith('docs')) {
-              rModuleName = rModuleName.substring(0, rModuleName.lastIndexOf('.'));
-            }
+  return name;
+};
 
-            if (modules[i].reasons.length > 0) {
-              // eslint-disable-next-line guard-for-in
-              for (var l in modules[i].reasons) {
-                referencedBy = modules[i].reasons[l].moduleName;
-                if (!referencedBy.endsWith('index.js')) {
-                  var referencedby = referencedBy.substring(referencedBy.lastIndexOf('/') + 1, referencedBy.lastIndexOf('.'));
-                  if (referencedby.endsWith('docs')) {
-                    rReferencedByArray.push(referencedby.substring(0, referencedby.lastIndexOf('.')));
-                  } else {
-                    rReferencedByArray.push(referencedBy.substring(referencedBy.lastIndexOf('/') + 1, referencedBy.lastIndexOf('.')));
-                  }
-                }
-              }
-            }
+class ModuleStatsPlugin {
+  constructor(options = {}) {
+    this.options = options;
+    this.options.filename = options.filename || 'js/moduleStats.js';
+  }
 
-            for (var module in modules) {
-              if (modules[module].name.startsWith('./src')) {
-                for (var reason in modules[module].reasons) {
-                  if (moduleName === modules[module].reasons[reason].moduleName && !(modules[module].name.indexOf('css') > -1)) {
-                    if (!modules[module].name.endsWith('react.js') && !(modules[module].name.indexOf('react-dom') > -1) && !modules[module].name.endsWith('.png')) {
-                      references = modules[module].name;
-                      rReferencesArray.push(references.substring(references.lastIndexOf('/') + 1, references.lastIndexOf('.')));
-                    }
-                  }
+  apply(compiler) {
+    compiler.hooks.emit.tap('ModuleStatsPlugin', compilation => {
+      let stats = compilation.getStats().toJson();
+      let results = {};
+      let {
+        modules
+      } = stats;
+
+      for (let module of modules) {
+        let {
+          name,
+          reasons
+        } = module;
+
+        if (isValidModule(name)) {
+          let references = new Set();
+          let referencedby = new Set();
+          let docsName;
+          let fileName;
+          compilation.modules.forEach(module => {
+            module.reasons.forEach(reason => {
+              let exportedValue = reason.dependency;
+
+              if (exportedValue.type === 'harmony export imported specifier') {
+                if (exportedValue.module.userRequest.includes(name.replace('.', ''))) {
+                  docsName = exportedValue.name;
                 }
               }
-            }
-
-            rReferencesArray = rReferencesArray.filter(function (item, index, inputArray) {
-              return inputArray.indexOf(item) === index;
             });
+          });
+          let currentModuleName = name;
+
+          if (Array.isArray(reasons)) {
+            for (let reason of reasons) {
+              let {
+                moduleName
+              } = reason;
+
+              if (isValidModule(moduleName)) {
+                let reasonedModuleName = moduleName;
+                referencedby.add(reasonedModuleName);
+              }
+            }
+          }
 
-            moduleDetails = {
-              name: rModuleName,
-              references: rReferencesArray,
-              referencedby: rReferencedByArray
-            };
+          for (let subModule of modules) {
+            let {
+              name: subModuleName,
+              reasons
+            } = subModule;
 
-            dre = '';
+            if (isValidModule(subModuleName)) {
+              let currentModuleName = subModuleName;
 
-            data.results.push(moduleDetails);
-            moduleDetails = {};
-            rReferencesArray = [];
-            rReferencedByArray = [];
-            referencedBy = '';
-            references = '';
+              if (Array.isArray(reasons)) {
+                for (let reason of reasons) {
+                  let {
+                    moduleName: reasonedModuleName
+                  } = reason;
 
-            //eslint-disable-next-line no-loop-func
-            data.results.forEach(function (mod) {
-              dre += '\'' + mod.name + '\':' + JSON.stringify(mod) + ',';
-            });
+                  if (name === reasonedModuleName) {
+                    references.add(currentModuleName);
+                  }
+                }
+              }
+            }
           }
-        }
 
-        var dataResult = '{' + dre + '}';
-        var mResult = 'let mdata = ' + dataResult;
+          results[currentModuleName] = {
+            name: currentModuleName,
+            references: Array.from(references),
+            referencedby: Array.from(referencedby),
+            docsName: docsName ? docsName : '',
+            fileName: name ? name : currentModuleName
+          };
+        }
+      }
 
-        compilation.assets[_this.options.filename] = {
-          source: function source() {
-            return mResult;
-          },
-          size: function size() {
-            return mResult.length;
-          }
-        };
-      });
-    }
-  }]);
+      compilation.assets[this.options.filename] = new _webpackSources.RawSource(JSON.stringify(results));
+    });
+  }
 
-  return ModuleStatsPlugin;
-}();
+}
 
 exports.default = ModuleStatsPlugin;

package/lib/plugins/OptimizeJSPlugin.js

@@ -1,58 +1,41 @@
-'use strict';
+"use strict";
 
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
+exports.default = void 0;
 
-var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+var _optimizeJs = _interopRequireDefault(require("optimize-js"));
 
-var _optimizeJs = require('optimize-js');
-
-var _optimizeJs2 = _interopRequireDefault(_optimizeJs);
-
-var _webpackSources = require('webpack-sources');
+var _webpackSources = require("webpack-sources");
 
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
-function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
-
-var OptimizeJSPlugin = function () {
-  function OptimizeJSPlugin() {
-    var options = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
-
-    _classCallCheck(this, OptimizeJSPlugin);
-
+class OptimizeJSPlugin {
+  constructor(options = {}) {
     this.optimize = options.optimize;
   }
 
-  _createClass(OptimizeJSPlugin, [{
-    key: 'apply',
-    value: function apply(compiler) {
-      compiler.hooks.compilation.tap('OptimizeJSPlugin', function (compilation) {
-        compilation.hooks.afterOptimizeChunks.tap('OptimizeJSPlugin', function (chunks) {
-          chunks.forEach(function (chunk) {
-            var files = chunk.files.map(function (file) {
-              return file;
-            });
-            files.filter(function (file) {
-              return (/\.js$/.test(file)
-              );
-            }).forEach(function (file) {
-              try {
-                var asset = compilation.assets[file].source();
-                var result = (0, _optimizeJs2.default)(asset);
-                compilation.assets[file] = new _webpackSources.RawSource(result);
-              } catch (e) {
-                compilation.errors.push(e);
-              }
-            });
+  apply(compiler) {
+    compiler.hooks.compilation.tap('OptimizeJSPlugin', compilation => {
+      compilation.hooks.afterOptimizeChunks.tap('OptimizeJSPlugin', chunks => {
+        chunks.forEach(chunk => {
+          const files = chunk.files.map(file => file);
+          files.filter(file => /\.js$/.test(file)).forEach(file => {
+            try {
+              const asset = compilation.assets[file].source();
+              const result = (0, _optimizeJs.default)(asset);
+              compilation.assets[file] = new _webpackSources.RawSource(result);
+            } catch (e) {
+              compilation.errors.push(e);
+            }
           });
         });
       });
-    }
-  }]);
+    });
+  }
 
-  return OptimizeJSPlugin;
-}();
+}
 
-exports.default = OptimizeJSPlugin;
+var _default = OptimizeJSPlugin;
+exports.default = _default;

package/lib/plugins/PublicPathCallbackPlugin.js

@@ -0,0 +1,63 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+const MODULE_TYPE = 'css/mini-extract';
+
+class PublicPathCallbackPlugin {
+  constructor({
+    callback
+  }) {
+    this.publicPathCallback = callback;
+  }
+
+  getCssChunkObject(mainChunk) {
+    const obj = {};
+
+    for (const chunk of mainChunk.getAllAsyncChunks()) {
+      for (const module of chunk.modulesIterable) {
+        if (module.type === MODULE_TYPE) {
+          obj[chunk.id] = 1;
+          break;
+        }
+      }
+    }
+
+    return obj;
+  }
+
+  needChunkOnDemandLoadingCode(chunk) {
+    for (const chunkGroup of chunk.groupsIterable) {
+      if (chunkGroup.getNumberOfChildren() > 0) {
+        return true;
+      }
+    }
+
+    return false;
+  }
+
+  apply(compiler) {
+    compiler.hooks.thisCompilation.tap('PublicPathCallbackPlugin', compilation => {
+      compilation.mainTemplate.hooks.requireEnsure.tap('PublicPathCallbackPlugin', (source, chunk) => {
+        const chunkMap = this.getCssChunkObject(chunk);
+
+        if (Object.keys(chunkMap).length > 0) {
+          return source.replace('__webpack_require__.p', `${this.publicPathCallback}("css")`);
+        }
+      });
+    });
+    compiler.hooks.compilation.tap('PublicPathCallbackPlugin', compilation => {
+      compilation.mainTemplate.hooks.localVars.tap('PublicPathCallbackPlugin', (source, chunk) => {
+        if (this.needChunkOnDemandLoadingCode(chunk)) {
+          return source.replace('__webpack_require__.p', `${this.publicPathCallback}("js")`);
+        }
+      });
+    });
+  }
+
+}
+
+var _default = PublicPathCallbackPlugin;
+exports.default = _default;