fix: fixed metafile generation, added docs how to use it

visulima · Nov 15, 2024 · f9fd349 · f9fd349
1 parent ace82f1
commit f9fd349
Show file tree

Hide file tree

Showing 4 changed files with 21 additions and 17 deletions.
diff --git a/packages/packem/README.md b/packages/packem/README.md
@@ -795,6 +795,13 @@ styles({
 });
 ```
 
+### Metafile
+
+Passing `--metafile` flag to tell `packem` to produce some metadata about the build in JSON format.
+You can feed the output file to analysis tools like [bundle buddy](https://www.bundle-buddy.com/rollup) to visualize the modules in your bundle and how much space each one takes up.
+
+The file outputs as metafile-{bundleName}-{format}.json, e.g. `packem` will generate metafile-test-cjs.json and metafile-test-es.json.
+
 ## Configuration
 
 ### packem.config.js

diff --git a/packages/packem/src/commands/build.ts b/packages/packem/src/commands/build.ts
@@ -73,7 +73,7 @@ const createBuildCommand = (cli: Cli): void => {
                             values: environments,
                         },
                     },
-                    sourcemap: options.analyze || options.sourcemap,
+                    sourcemap: options.metafile || options.analyze || options.sourcemap,
                     tsconfigPath: options.tsconfig ?? undefined,
                     validation:
                         options.validation === false

diff --git a/packages/packem/src/rollup/get-rollup-options.ts b/packages/packem/src/rollup/get-rollup-options.ts
@@ -589,10 +589,7 @@ export const getRollupOptions = async (context: BuildContext, fileCache: FileCac
             ...postPlugins,
 
             context.options.rollup.metafile &&
-                metafilePlugin({
-                    outDir: resolve(context.options.rootDir, context.options.outDir),
-                    rootDir: context.options.rootDir,
-                }),
+                metafilePlugin(),
 
             context.options.rollup.copy && copyPlugin(context.options.rollup.copy, context.logger),
 

diff --git a/packages/packem/src/rollup/plugins/metafile.ts b/packages/packem/src/rollup/plugins/metafile.ts
@@ -1,20 +1,15 @@
-import { writeJsonSync } from "@visulima/fs";
-import { resolve } from "@visulima/path";
-import type { Plugin } from "rollup";
-
-interface MetafileOptions {
-    outDir: string;
-    rootDir: string;
-}
+import type { OutputBundle, OutputOptions, Plugin } from "rollup";
+import {  } from "@visulima/fs/utils";
+import { ENDING_RE } from "../../constants";
 
 interface MetaInfo {
     source: string;
     target: string;
 }
 
-const metafilePlugin = (options: MetafileOptions): Plugin =>
+const metafilePlugin = (): Plugin =>
     ({
-        async buildEnd() {
+        async generateBundle(outputOptions: OutputOptions, outputBundle: OutputBundle) {
             const deps: MetaInfo[] = [];
 
             for (const id of this.getModuleIds()) {
@@ -34,9 +29,14 @@ const metafilePlugin = (options: MetafileOptions): Plugin =>
                 return;
             }
 
-            const outPath = resolve(options.rootDir, options.outDir, `graph.json`);
+            const outputBundleKeys = Object.keys(outputBundle);
 
-            writeJsonSync(outPath, deps);
+            this.emitFile({
+                // eslint-disable-next-line @typescript-eslint/restrict-template-expressions
+                fileName: `metafile-${(outputBundleKeys[0] as string).replace(ENDING_RE, "")}-${outputOptions.format}.json`,
+                source: JSON.stringify(deps, null, 2),
+                type: "asset",
+            });
         },
         name: "packem:metafile",
     }) as Plugin;