rollup-plugin-visualizer - npm Package Compare versions

Comparing version 5.8.3 to 5.9.0

dist/bin/cli.js

@@ -24,3 +24,3 @@ #!/usr/bin/env node
     type: "string",
-    default: "RollUp Visualizer",
+    default: "Rollup Visualizer",
 })
@@ -27,0 +27,0 @@ .option("template", {

dist/plugin/compress.d.ts

 import * as zlib from "zlib";
-export declare type SizeGetter = (code: string) => Promise<number>;
+export type SizeGetter = (code: string) => Promise<number>;
 export declare const createGzipSizeGetter: (options: zlib.ZlibOptions) => SizeGetter;
 export declare const createBrotliSizeGetter: (options: zlib.BrotliOptions) => SizeGetter;

dist/plugin/data.d.ts

 import { GetModuleInfo } from "rollup";
-import { ModuleLengths, ModuleTree, ModuleTreeLeaf } from "../types/types";
+import { ModuleLengths, ModuleTree, ModuleTreeLeaf } from "../shared/types";
 import { ModuleMapper } from "./module-mapper";
@@ -4,0 +4,0 @@ export declare const buildTree: (bundleId: string, modules: Array<ModuleLengths & {

dist/plugin/data.js

 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.addLinks = exports.mergeTrees = exports.buildTree = void 0;
-const types_1 = require("../types/types");
+const types_1 = require("../shared/types");
 const addToPath = (moduleId, tree, modulePath, node) => {
@@ -6,0 +6,0 @@ if (modulePath.length === 0) {

dist/plugin/index.d.ts

 import { Plugin, OutputOptions } from "rollup";
 import opn from "open";
 import { TemplateType } from "./template-types";
+import { Filter } from "../shared/create-filter";
 export interface PluginVisualizerOptions {
@@ -15,2 +16,3 @@ /**
      * @default false
+     * @deprecated use template 'raw-data'
      */
@@ -25,3 +27,3 @@ json?: boolean;
     /**
-     * If plugin should open browser with generated file. Ignored when `json` is true.
+     * If plugin should open browser with generated file. Ignored when `json` or `emitFile` is true.
      *
@@ -71,4 +73,14 @@ * @default false
     emitFile?: boolean;
+    /**
+     * A valid picomatch pattern, or array of patterns. If options.include is omitted or has zero length, filter will return true by
+     * default. Otherwise, an ID must match one or more of the picomatch patterns, and must not match any of the options.exclude patterns.
+     */
+    include?: Filter | Filter[];
+    /**
+     * A valid picomatch pattern, or array of patterns. If options.include is omitted or has zero length, filter will return true by
+     * default. Otherwise, an ID must match one or more of the picomatch patterns, and must not match any of the options.exclude patterns.
+     */
+    exclude?: Filter | Filter[];
 }
 export declare const visualizer: (opts?: PluginVisualizerOptions | ((outputOptions: OutputOptions) => PluginVisualizerOptions)) => Plugin;
 export default visualizer;

dist/plugin/index.js

@@ -16,2 +16,3 @@ "use strict";
 const render_template_1 = require("./render-template");
+const create_filter_1 = require("../shared/create-filter");
 const WARN_SOURCEMAP_DISABLED = "rollup output configuration missing sourcemap = true. You should add output.sourcemap = true or disable sourcemap in this plugin";
@@ -43,3 +44,3 @@ const WARN_SOURCEMAP_MISSING = (id) => `${id} missing source map`;
             const filename = (_a = opts.filename) !== null && _a !== void 0 ? _a : chooseDefaultFileName(opts);
-            const title = (_b = opts.title) !== null && _b !== void 0 ? _b : "RollUp Visualizer";
+            const title = (_b = opts.title) !== null && _b !== void 0 ? _b : "Rollup Visualizer";
             const open = !!opts.open;
@@ -49,2 +50,3 @@ const openOptions = (_c = opts.openOptions) !== null && _c !== void 0 ? _c : {};
             const projectRoot = (_e = opts.projectRoot) !== null && _e !== void 0 ? _e : process.cwd();
+            const filter = (0, create_filter_1.createFilter)(opts.include, opts.exclude);
             const gzipSize = !!opts.gzipSize && !opts.sourcemap;
@@ -59,7 +61,8 @@ const brotliSize = !!opts.brotliSize && !opts.sourcemap;
             const ModuleLengths = async ({ id, renderedLength, code, }) => {
+                const isCodeEmpty = code == null || code == "";
                 const result = {
                     id,
-                    gzipLength: code == null || code == "" ? 0 : await gzipSizeGetter(code),
-                    brotliLength: code == null || code == "" ? 0 : await brotliSizeGetter(code),
-                    renderedLength: code == null || code == "" ? renderedLength : Buffer.byteLength(code, "utf-8"),
+                    gzipLength: isCodeEmpty ? 0 : await gzipSizeGetter(code),
+                    brotliLength: isCodeEmpty ? 0 : await brotliSizeGetter(code),
+                    renderedLength: isCodeEmpty ? renderedLength : Buffer.byteLength(code, "utf-8"),
                 };
@@ -83,3 +86,5 @@ return result;
                     const modules = await (0, sourcemap_1.getSourcemapModules)(bundleId, bundle, (_g = (_f = outputOptions.dir) !== null && _f !== void 0 ? _f : (outputOptions.file && path_1.default.dirname(outputOptions.file))) !== null && _g !== void 0 ? _g : process.cwd());
-                    const moduleRenderInfo = await Promise.all(Object.values(modules).map(({ id, renderedLength }) => {
+                    const moduleRenderInfo = await Promise.all(Object.values(modules)
+                        .filter(({ id }) => filter(bundleId, id))
+                        .map(({ id, renderedLength }) => {
                         var _a;
@@ -92,3 +97,5 @@ const code = (_a = bundle.modules[id]) === null || _a === void 0 ? void 0 : _a.code;
                 else {
-                    const modules = await Promise.all(Object.entries(bundle.modules).map(([id, { renderedLength, code }]) => ModuleLengths({ id, renderedLength, code })));
+                    const modules = await Promise.all(Object.entries(bundle.modules)
+                        .filter(([id]) => filter(bundleId, id))
+                        .map(([id, { renderedLength, code }]) => ModuleLengths({ id, renderedLength, code })));
                     tree = (0, data_1.buildTree)(bundleId, modules, mapper);
@@ -95,0 +102,0 @@ }

dist/plugin/module-mapper.d.ts

@@ -1,2 +0,2 @@
-import { ModuleMeta, ModuleLengths, ModuleUID } from "../types/types";
+import { ModuleMeta, ModuleLengths, ModuleUID } from "../shared/types";
 export declare class ModuleMapper {
@@ -3,0 +3,0 @@ private projectRoot;

dist/plugin/module-mapper.js

@@ -16,2 +16,5 @@ "use strict";
     trimProjectRootId(moduleId) {
+        if (typeof this.projectRoot === 'string' && moduleId.startsWith(this.projectRoot)) {
+            return moduleId.slice(this.projectRoot.length);
+        }
         return moduleId.replace(this.projectRoot, "");
@@ -55,3 +58,3 @@ }
         }
-        this.nodeParts[uid] = { ...value, mainUid: this.getModuleUid(moduleId) };
+        this.nodeParts[uid] = { ...value, metaUid: this.getModuleUid(moduleId) };
         return uid;
@@ -58,0 +61,0 @@ }

dist/plugin/render-template.d.ts

@@ -1,4 +0,4 @@
-import { VisualizerData } from "../types/types";
+import { VisualizerData } from "../shared/types";
 import { TemplateType } from "./template-types";
-export declare type RenderTemplateOptions = {
+export type RenderTemplateOptions = {
     data: VisualizerData;
@@ -5,0 +5,0 @@ title: string;

dist/plugin/render-template.js

@@ -70,3 +70,3 @@ "use strict";
             // eslint-disable-next-line @typescript-eslint/no-unused-vars
-            const { mainUid, ...lengths } = data.nodeParts[uid];
+            const { metaUid: mainUid, ...lengths } = data.nodeParts[uid];
             bundles[bundleId] = (_a = bundles[bundleId]) !== null && _a !== void 0 ? _a : [];
@@ -73,0 +73,0 @@ bundles[bundleId].push([meta.id, lengths]);

dist/plugin/template-types.d.ts

@@ -1,3 +0,3 @@
-export declare type TemplateType = "sunburst" | "treemap" | "network" | "raw-data" | "list";
+export type TemplateType = "sunburst" | "treemap" | "network" | "raw-data" | "list";
 declare const templates: ReadonlyArray<TemplateType>;
 export default templates;

package.json

 {
   "name": "rollup-plugin-visualizer",
-  "version": "5.8.3",
+  "version": "5.9.0",
   "main": "./dist/plugin/index.js",
@@ -23,13 +23,11 @@ "author": "Denis Bardadym <[e-mail]>",
     "build:plugin": "tsc",
-    "build:frontend": "node build.js",
+    "build:frontend": "rollup -c rollup.config.js",
+    "build-dev": "rollup -c rollup.config-dev.js",
     "clean": "del-cli dist",
-    "test": "run-s test:*",
-    "test:e2e": "node build.js --all --e2e",
-    "test:test": "node build.js --all --test",
-    "test:e2e-sourcemap": "node build.js --all --e2e --sourcemap",
-    "test:test-sourcemap": "node build.js --all --test --sourcemap",
-    "test:cli": "node build.js --dev --all --gzip --brotli --sourcemap --raw-data && node dist/bin/cli.js ./stats.raw-data.json"
+    "prebuild": "npm run clean",
+    "test": "jest"
   },
   "dependencies": {
     "open": "^8.4.0",
+    "picomatch": "^2.3.1",
     "source-map": "^0.7.4",
@@ -47,5 +45,7 @@ "yargs": "^17.5.1"
   "devDependencies": {
-    "@rollup/plugin-commonjs": "^23.0.0",
+    "@jest/globals": "^29.3.1",
+    "@rollup/plugin-alias": "^4.0.2",
+    "@rollup/plugin-commonjs": "^24.0.0",
     "@rollup/plugin-node-resolve": "^15.0.0",
-    "@rollup/plugin-typescript": "^9.0.1",
+    "@rollup/plugin-typescript": "^10.0.1",
     "@types/bytes": "^3.1.1",
@@ -59,2 +59,3 @@ "@types/d3-array": "^3.0.3",
     "@types/node": "^18.8.5",
+    "@types/picomatch": "^2.3.0",
     "@types/yargs": "^17.0.10",
@@ -74,3 +75,5 @@ "@typescript-eslint/eslint-plugin": "^5.25.0",
     "eslint-plugin-prettier": "^4.0.0",
+    "jest": "^29.3.1",
     "npm-run-all": "^4.1.5",
+    "picomatch-browser": "^2.2.6",
     "postcss": "^8.4.14",
@@ -83,3 +86,4 @@ "postcss-url": "^10.1.3",
     "sass": "^1.52.1",
-    "typescript": "~4.8.0"
+    "ts-jest": "^29.0.3",
+    "typescript": "~4.9.0"
   },
@@ -86,0 +90,0 @@ "engines": {

README.md

@@ -70,3 +70,3 @@ # Rollup Plugin Visualizer
       emitFile: true,
-      file: "stats.html",
+      filename: "stats.html",
     }),
@@ -94,7 +94,7 @@ ],
 
-This circular hierarchical diagram can help you find huge peaces of code (aka that one huge thing). If you click on some arc it will increase its and all nested arcs size for better inspection.
+This circular hierarchical diagram can help you find huge pieces of code (aka that one huge thing). If you click on some arc it will increase its and all nested arcs size for better inspection.
 
 ### Treemap
 
-This rectangular hierarchical diagram can help you find huge peaces. Just look on biggest reclangle. But also it can help you find modules included several times, they will have the same topology and relative size. If you click on reclangle it will increase in size for further inspection.
+This rectangular hierarchical diagram can help you find huge pieces. Just look on biggest reclangle. But also it can help you find modules included several times, they will have the same topology and relative size. If you click on reclangle it will increase in size for further inspection.
 
@@ -105,3 +105,3 @@ ### Network
 
-In real life scenarious, sometimes you will see terribly connected diagrams. There is no 100% working solution for everyone, it is expected you topology will look 'terrible' and not hold on screen. To make it still visually ispectable, first remove all highly connected nodes that you see (typical examples: commonjsHelpers, tslib, react etc, basically if tooltip for the node is not hold on the screen - exclude this node), after layout stabilization you will see, your layout is not that terrible anymore and most of dependencies cluster together. Move layout to find peaces you looked for.
+In real life scenarious, sometimes you will see terribly connected diagrams. There is no 100% working solution for everyone, it is expected you topology will look 'terrible' and not hold on screen. To make it still visually ispectable, first remove all highly connected nodes that you see (typical examples: commonjsHelpers, tslib, react etc, basically if tooltip for the node is not hold on the screen - exclude this node), after layout stabilization you will see, your layout is not that terrible anymore and most of dependencies cluster together. Move layout to find pieces you looked for.
 
@@ -140,2 +140,10 @@ When you click on node it will hightlight nodes that are listed in tooltip (the files that imports current node).
 
+`include` (Filter | Filter[], default `undefined`) - Filter for inclusion
+
+`exclude` (Filter | Filter[], default `undefined`) - Filter for exclusion
+
+`Filter` type is `{ bundle?: picomatchPattern, file?: picomatchPattern }`
+
+**Note about `include` and `exclude`** - If options.include is omitted or has zero length, filter will return true by default. Otherwise, an ID must match one or more of the picomatch patterns, and must not match any of the options.exclude patterns. This entries will not be included in stats at all.
+
 ## CLI
@@ -173,1 +181,9 @@
 See CHANGELOG.md.
+
+## Versioning
+
+* Plugin backend (one appears in configs) are strictly follows SemVer
+* Plugin frontend (generated file):
+  * `network`, `treemap`, `sunburst` can change does not matter of version (colors, texts, visual structure etc)
+  * `raw-data` format follows own `version` property
+  * `list` follows semver

No alert changes

Improved metrics

Number of package files

37

increased by2.78%

Lines of code

17960

increased by44.31%

Number of lines in readme file

185

increased by9.47%

Worsened metrics

Total package byte prevSize

671423

decreased by-58.98%

Dependency count

5

increased by25%

Dev dependency count

40

increased by17.65%

Dependency changes

• + Addedpicomatch@^2.3.1

• + Addedpicomatch@2.3.1(transitive)