rollup-plugin-visualizer - npm Package Compare versions

Comparing version 2.7.2 to 3.0.0

package.json

 {
   "name": "rollup-plugin-visualizer",
-  "version": "2.7.2",
+  "version": "3.0.0",
   "main": "plugin/index.js",
   "author": "Denis Bardadym <[e-mail]>",
   "license": "MIT",
+  "bin": "./bin/cli.js",
   "files": [
+    "bin/*",
     "lib/*",
@@ -21,12 +23,14 @@ "plugin/*"
     "lint": "eslint .",
-    "build": "rollup -c rollup.config.js",
-    "build:dev": "rollup -c rollup.config-dev.js",
+    "build": "node build.js",
     "clean": "del-cli lib",
-    "prepare": "yarn run build"
+    "prepare": "yarn run build",
+    "test": "node build.js --all"
   },
   "dependencies": {
     "mkdirp": "^0.5.1",
+    "nanoid": "^2.1.6",
     "open": "^6.0.0",
     "pupa": "^2.0.0",
-    "source-map": "^0.7.3"
+    "source-map": "^0.7.3",
+    "yargs": "^14.2.0"
   },
@@ -40,5 +44,7 @@ "peerDependencies": {
     "d3-collection": "^1.0.7",
+    "d3-color": "^1.4.0",
     "d3-force": "^2.0.1",
     "d3-hierarchy": "^1.1.8",
     "d3-scale": "^3.0.0",
+    "d3-scale-chromatic": "^1.5.0",
     "d3-selection": "^1.4.0",
@@ -45,0 +51,0 @@ "d3-shape": "^1.3.4",

plugin/build-stats.js

@@ -17,5 +17,5 @@ "use strict";
     readFile(path.join(__dirname, "stats.template"), "utf-8"),
-    readFile(path.join(__dirname, "..", "lib", `main-${graphType}.js`), "utf8"),
-    readFile(path.join(__dirname, "..", "lib", `style-${graphType}.css`), "utf8"),
-    styleOverridePath ? readFile(styleOverridePath, "utf8") : Promise.resolve()
+    readFile(path.join(__dirname, "..", "lib", `script-${graphType}.js`), "utf8"),
+    readFile(path.join(__dirname, "..", "lib", `script-${graphType}.css`), "utf8"),
+    styleOverridePath ? readFile(styleOverridePath, "utf8") : Promise.resolve("")
   ]);
@@ -22,0 +22,0 @@

plugin/index.js

@@ -14,17 +14,10 @@ "use strict";
 
+const TEMPLATE = require("./template-types");
+
+const ModuleMapper = require("./module-mapper");
+
 const buildStats = require("./build-stats");
-const { buildTree, mergeTrees } = require("./hierarchy");
-const { buildGraph, mergeGraphs } = require("./graph");
+const { buildTree, mergeTrees, addLinks, removeCommonPrefix } = require("./data");
 const addMinifiedSizesToModules = require("./sourcemap");
 
-const HIERARCHY = "hierarchy";
-const GRAPH = "graph";
-
-const DATA_TYPE_FOR_TEMPLATE = {
-  circlepacking: HIERARCHY,
-  sunburst: HIERARCHY,
-  treemap: HIERARCHY,
-  network: GRAPH
-};
-
 const WARN_SOURCEMAP_DISABLED =
@@ -43,7 +36,15 @@ "rollup output configuration missing sourcemap = true. You should add output.sourcemap = true or disable sourcemap in this plugin";
 
-  const template = opts.template || "sunburst";
-  const styleOverridePath = opts.styleOverridePath;
+  const template = opts.template || "treemap";
+  if (!TEMPLATE.includes(template)) {
+    throw new Error(`Unknown template type ${template}`);
+  }
 
-  const bundlesRelative = !!opts.bundlesRelative;
+  let extraStylePath = opts.extraStylePath;
+  if (opts.styleOverridePath) {
+    console.warn("[rollup-plugin-visualizer] `styleOverridePath` was renamed to `extraStylePath`");
+    extraStylePath = opts.styleOverridePath;
+  }
 
+  const json = !!opts.json;
+
   const chartParameters = opts.chartParameters || {};
@@ -59,6 +60,7 @@
 
-      let roots = [];
+      const roots = [];
+      const mapper = new ModuleMapper();
+      const links = [];
 
-      const dataType = DATA_TYPE_FOR_TEMPLATE[template];
-
+      // collect trees
       for (const [id, bundle] of Object.entries(outputBundle)) {
@@ -83,44 +85,31 @@ if (bundle.isAsset) continue; //only chunks
 
-        let root = null;
-        switch (dataType) {
-          case HIERARCHY: {
-            root = buildTree(Object.keys(bundle.modules), getInitialModuleData);
-            break;
-          }
-          case GRAPH: {
-            root = buildGraph(
-              bundle.facadeModuleId,
-              this.getModuleInfo.bind(this),
-              getInitialModuleData
-            );
-            break;
-          }
-          default: {
-            this.error(`Unknown template ${template} type`);
-          }
-        }
+        const tree = buildTree(id, Object.keys(bundle.modules), getInitialModuleData, mapper);
 
-        roots.push({ id, root });
+        roots.push(tree);
       }
 
-      const id = "bundles";
-      if (bundlesRelative) {
-        switch (dataType) {
-          case HIERARCHY: {
-            roots = mergeTrees(id, roots);
-            break;
-          }
-          case GRAPH: {
-            roots = mergeGraphs(id, roots);
-            break;
-          }
-        }
+      // after trees we process links (this is mostly for uids)
+      for (const bundle of Object.values(outputBundle)) {
+        if (bundle.isAsset || bundle.facadeModuleId == null) continue; //only chunks
 
-        roots = [roots];
+        addLinks(bundle.facadeModuleId, this.getModuleInfo.bind(this), links, mapper);
       }
 
-      const html = await buildStats(title, roots, template, styleOverridePath, chartParameters);
+      const tree = mergeTrees(roots);
 
+      const { nodes, nodeIds } = mapper;
+      removeCommonPrefix(nodeIds);
+
+      for (const [id, uid] of Object.entries(nodeIds)) {
+        nodes[uid].id = id;
+      }
+
+      const data = { tree, nodes, links };
+
+      const fileContent = json
+        ? JSON.stringify(data, null, 2)
+        : await buildStats(title, data, template, extraStylePath, chartParameters);
+
       await mkdir(path.dirname(filename));
-      await writeFile(filename, html);
+      await writeFile(filename, fileContent);
 
@@ -127,0 +116,0 @@ if (open) {

README.md

@@ -45,8 +45,6 @@ # Rollup Plugin Visualizer
 
-`template` (string, default `sunburst`) - Which digram type to use: `sunburst`, `treemap`, `circlepacking`, `network` (very early stage, feedback welcomed)
+`template` (string, default `treemap`) - Which digram type to use: `sunburst`, `treemap`, `circlepacking`, `network` (very early stage, feedback welcomed)
 
-`styleOverridePath` (string, default `undefined`) - Link your own css file to override or enhance the current templates
+`extraStylePath` (string, default `undefined`) - Link your own css file to override or enhance the current templates
 
-`bundlesRelative` (boolean, default `false`) - Combine all bundles to one diagram
-
 `chartParameters.width` (number, default `undefined`) - Set svg viewBox width to this number
@@ -56,2 +54,14 @@
 
+`json` (boolean, default `false`) - Product portable json file that can be used with plugin CLI util to generate graph from several json files. Every UI property ignored in this case.
+
+## CLI
+
+This plugin provides cli util `rollup-plugin-visualizer`. Add `--help` to check actual options. It can be used like:
+
+```sh
+rollup-plugin-visualizer [OPTIONS] stat1.json stat2.json ../stat3.json
+```
+
+This can be usefull in case you have different config files in the same project and you want to display all of them in the same chart.
+
 ## Build plugin
@@ -76,6 +86,8 @@
 
-v1 -> v2: For v2 was a lot of internal changes, but external interface has not changed. 
+v1 -> v2: For v2 was a lot of internal changes, but external interface has not changed.
 
+V2 -> V3: `template` now by default `treemap`, `bundlesRelative` was removed as it is always default behaviour.
+
 ## Acknowledgements
 
 Initially this plugin was based on `webpack-visualizer`, but in the end used only styles and layout. Thanks to the tons of people around internet for great examples of d3 usage. Also i would like to thank you Mike Bostock for awesome D3, and tons of examples.

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Major refactor

Supply chain risk

Package has recently undergone a major refactor. It may be unstable or indicate significant internal changes. Use caution when updating to versions that include significant changes.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Lines of code

13215

increased by38.65%

Number of lines in readme file

91

increased by15.19%

Worsened metrics

Total package byte prevSize

431007

decreased by-56.23%

Dependency count

7

increased by40%

Dev dependency count

19

increased by11.76%

Number of package files

19

decreased by-13.64%

Number of low supply chain risk alerts

3

increased by50%

Number of medium supply chain risk alerts

1

increased byInfinity%

Dependency changes

• + Addednanoid@^2.1.6

• + Addedyargs@^14.2.0

• + Addedansi-regex@4.1.1(transitive)

• + Addedansi-styles@3.2.1(transitive)

• + Addedcamelcase@5.3.1(transitive)

• + Addedcliui@5.0.0(transitive)

• + Addedcolor-convert@1.9.3(transitive)

• + Addedcolor-name@1.1.3(transitive)

• + Addeddecamelize@1.2.0(transitive)

• + Addedemoji-regex@7.0.3(transitive)

• + Addedfind-up@3.0.0(transitive)

• + Addedget-caller-file@2.0.5(transitive)

• + Addedis-fullwidth-code-point@2.0.0(transitive)

• + Addedlocate-path@3.0.0(transitive)

• + Addednanoid@2.1.11(transitive)

• + Addedp-limit@2.3.0(transitive)

• + Addedp-locate@3.0.0(transitive)

• + Addedp-try@2.2.0(transitive)

• + Addedpath-exists@3.0.0(transitive)

• + Addedrequire-directory@2.1.1(transitive)

• + Addedrequire-main-filename@2.0.0(transitive)

• + Addedset-blocking@2.0.0(transitive)

• + Addedstring-width@3.1.0(transitive)

• + Addedstrip-ansi@5.2.0(transitive)

• + Addedwhich-module@2.0.1(transitive)

• + Addedwrap-ansi@5.1.0(transitive)

• + Addedy18n@4.0.3(transitive)

• + Addedyargs@14.2.3(transitive)

• + Addedyargs-parser@15.0.3(transitive)