webpack-federation-stats-plugin 1.0.3-beta.0 → 1.1.1

package/FederationStatsPlugin.js

@@ -3,20 +3,19 @@ const PLUGIN_NAME = "FederationStatsPlugin"
 const EXTENSION_REGEX = /\.[^/.]+$/
 
 class FederationStatsPlugin {
-  constructor(options = {fileName: "federation-stats.json"}) {
-    if (!options.fileName) throw new Error("fileName option is required.")
-    this._options = options
+  constructor(options = {}) {
+    this._options = {fileName: "federation-stats.json", ...options}
   }
 
   apply(compiler) {
-    const federationPlugin = compiler.options.plugins.find((plugin) => plugin.constructor.name === "ModuleFederationPlugin")
+    const federationPlugin = compiler.options.plugins && compiler.options.plugins.find((plugin) => plugin.constructor.name === "ModuleFederationPlugin")
 
-    if (!federationPlugin) {
-      throw new Error("No ModuleFederationPlugin found.")
-    }
+    if (!federationPlugin) throw new Error("No ModuleFederationPlugin found.")
 
     const appName = federationPlugin._options.name
-    const exposedFiles = new Map(Object.entries(federationPlugin._options.exposes || {}).map(([k, v]) => [v, k]))
+
+    // get exposed modules from the ModuleFederationPlugin
+    const exposedFiles = new Map(Object.entries(federationPlugin._options.exposes || {}).map(([k, v]) => (typeof v === "object" ? [v.import, k] : [v, k])))
 
     compiler.hooks.thisCompilation.tap(PLUGIN_NAME, (compilation) => {
       compilation.hooks.processAssets.tapPromise(
@@ -25,51 +24,59 @@ class FederationStatsPlugin {
           stage: compilation.constructor.PROCESS_ASSETS_STAGE_REPORT,
         },
         async () => {
-          const stats = compilation.getStats().toJson()
-          const modules = stats.modules.filter((module) => {
-            const moduleName = module.name.replace(EXTENSION_REGEX, "")
-            return exposedFiles.has(moduleName)
-          })
+          const stats = compilation.getStats().toJson({})
+          // find mf modules
+          const mfModules = stats.modules.filter((module) => module.issuerName === "container entry" && exposedFiles.has(module.name.replace(EXTENSION_REGEX, "")))
 
           const chunksReducer = (chunksArr, current) => {
             current.siblings.forEach((s) => {
               const chunk = stats.chunks.find((c) => c.id === s)
-              if (chunk) {
-                chunk.files.forEach((f) => chunksArr.push(f))
-              }
+              chunk.files.forEach((f) => chunksArr.push(f))
             })
             current.files.forEach((f) => chunksArr.push(f))
             return chunksArr
           }
 
-          const chunks = modules.reduce((acc, module) => {
-            const moduleName = module.name.replace(EXTENSION_REGEX, "")
-            let exposedAs = exposedFiles.get(moduleName)
-            if (exposedAs.startsWith("./")) {
-              exposedAs = exposedAs.substring(2)
-            }
-
-            const moduleChunks = module.chunks
+          const chunks = mfModules.map((module) => {
+            const exposedAs = exposedFiles.get(module.name.replace(EXTENSION_REGEX, ""))
+            const chunks = module.chunks
               .map((chunkId) => stats.chunks.find((chunk) => chunk.id === chunkId))
-              .filter((chunk) => chunk && chunk.runtime.includes(appName))
+              .filter((chunk) => chunk.runtime.includes(appName))
               .reduce(chunksReducer, [])
+            return {
+              module: exposedAs,
+              chunks: chunks,
+              id: module.id,
+            }
+          })
 
-            acc[exposedAs] = [...new Set(moduleChunks)]
-            return acc
-          }, {})
+          const exposes = chunks.reduce((result, current) => Object.assign(result, {[current.module.replace("./", "")]: current.chunks}), {})
+          const name = (federationPlugin._options.library && federationPlugin._options.library.name) || federationPlugin._options.name
 
           const statsResult = {
-            name: appName,
-            exposes: chunks,
-            publicUrl: this._options.publicUrl || "",
+            name,
+            exposes,
+          }
+
+          const publicUrl = this._options.publicUrl
+          if (publicUrl) {
+            statsResult.publicUrl = publicUrl
           }
 
           const fileName = this._options.fileName
-          compilation.emitAsset(fileName, {
-            source: () => Buffer.from(JSON.stringify(statsResult, null, 2), "utf-8"),
-            size: () => Buffer.byteLength(JSON.stringify(statsResult, null, 2)),
-          })
-        },
+          const statsBuffer = Buffer.from(JSON.stringify(statsResult), "utf-8")
+          const mfStats = {
+            source: () => statsBuffer,
+            size: () => statsBuffer.length,
+          }
+
+          const asset = compilation.getAsset(fileName)
+          if (asset) {
+            compilation.updateAsset(fileName, mfStats)
+          } else {
+            compilation.emitAsset(fileName, mfStats)
+          }
+        }
       )
     })
   }

package/LICENSE

@@ -1,6 +1,6 @@
 MIT License
 
-Copyright (c) 2021 DanielAmenou
+Copyright (c) 2026 DanielAmenou
 
 Permission is hereby granted, free of charge, to any person obtaining a copy
 of this software and associated documentation files (the "Software"), to deal

package/README.md

@@ -1,40 +1,114 @@
 # webpack-federation-stats-plugin
 
+[![npm version](https://img.shields.io/npm/v/webpack-federation-stats-plugin)](https://www.npmjs.com/package/webpack-federation-stats-plugin)
+[![npm downloads](https://img.shields.io/npm/dt/webpack-federation-stats-plugin)](https://www.npmjs.com/package/webpack-federation-stats-plugin)
+[![npm monthly downloads](https://img.shields.io/npm/dm/webpack-federation-stats-plugin)](https://www.npmjs.com/package/webpack-federation-stats-plugin)
+[![license](https://img.shields.io/npm/l/webpack-federation-stats-plugin)](https://github.com/DanielAmenou/webpack-federation-stats-plugin/blob/main/LICENSE)
+
+A Webpack plugin that extracts [Module Federation](https://webpack.js.org/concepts/module-federation/) stats into a JSON file. It maps each exposed module to its required chunks, making it useful for tools like [loadable-components](https://loadable-components.com/) that need to know which chunks to load for a given federated module.
+
 ## Installation
 
-`npm i --save-dev webpack-federation-stats-plugin`
+```bash
+npm install --save-dev webpack-federation-stats-plugin
+```
 
-`yarn add --dev webpack-federation-stats-plugin`
+or
+
+```bash
+yarn add --dev webpack-federation-stats-plugin
+```
 
 ## Usage
 
 ```javascript
-const FederationStatsPlugin = require("webpack-federation-stats-plugin");
+const FederationStatsPlugin = require("webpack-federation-stats-plugin")
+
+module.exports = {
+  plugins: [new FederationStatsPlugin()],
+}
+```
+
+> **Note:** The plugin requires `ModuleFederationPlugin` to be configured in the same Webpack config. It will throw an error if it is not found.
+
+## Options
+
+| Option      | Type     | Default                   | Description                                      |
+| ----------- | -------- | ------------------------- | ------------------------------------------------ |
+| `fileName`  | `string` | `"federation-stats.json"` | The name of the output JSON file.                |
+| `publicUrl` | `string` | —                         | An optional public URL to include in the output. |
+
+### Example with options
+
+```javascript
+const FederationStatsPlugin = require("webpack-federation-stats-plugin")
+
+module.exports = {
+  plugins: [
+    new FederationStatsPlugin({
+      fileName: "federation-stats.json",
+      publicUrl: "https://cdn.example.com/",
+    }),
+  ],
+}
+```
+
+## Output
+
+The plugin generates a JSON file that maps each exposed module to the chunk files it needs at runtime. This is the information a consuming application needs to know **which scripts to load** before importing a federated module.
+
+Given the following Module Federation config:
+
+```javascript
+const {ModuleFederationPlugin} = require("webpack").container
+const FederationStatsPlugin = require("webpack-federation-stats-plugin")
 
 module.exports = {
   plugins: [
-    new FederationStatsPlugin({filename: "federation-stats.json"}),
+    new ModuleFederationPlugin({
+      name: "shop",
+      exposes: {
+        "./ProductCard": "./src/components/ProductCard",
+        "./CartIcon": "./src/components/CartIcon",
+        "./useCart": "./src/hooks/useCart",
+      },
+    }),
+    new FederationStatsPlugin(),
   ],
-};
+}
 ```
 
-### Example Output
+The plugin will emit a `federation-stats.json` like this:
 
 ```json
 {
-  "name": "AppName",
+  "name": "shop",
   "exposes": {
-    "module1": [
-      "vendors-node_modules_babel_runtime_helpers_esm_slicedToArray.js",
-      "vendors-node_modules_core-js.js",
-      "vendors-node_modules_prop-types_index_js.js",
-    ],
-    "module2": ["vendors-node_modules_core-js.js",],
-    "module3": [
-      "vendors-node_modules_babel.js",
-      "vendors-node_modules_core-js.js",
-    ]
+    "ProductCard": ["vendors-node_modules_react-dom_index_js.js", "vendors-node_modules_styled-components_dist_index_js.js", "src_components_ProductCard_index_tsx.js"],
+    "CartIcon": ["vendors-node_modules_react-dom_index_js.js", "src_components_CartIcon_index_tsx.js"],
+    "useCart": ["src_hooks_useCart_ts.js"]
   }
 }
+```
+
+Each key under `exposes` corresponds to an exposed module (without the `./` prefix), and its value is the list of chunk files that must be loaded for that module to work.
 
+### With `publicUrl`
+
+When a `publicUrl` is provided, it is included in the output so consumers can resolve the full URL for each chunk:
+
+```json
+{
+  "name": "shop",
+  "publicUrl": "https://cdn.example.com/shop/",
+  "exposes": {
+    "ProductCard": ["vendors-node_modules_react-dom_index_js.js", "vendors-node_modules_styled-components_dist_index_js.js", "src_components_ProductCard_index_tsx.js"],
+    "CartIcon": ["vendors-node_modules_react-dom_index_js.js", "src_components_CartIcon_index_tsx.js"],
+    "useCart": ["src_hooks_useCart_ts.js"]
+  }
+}
 ```
+
+## License
+
+[MIT](LICENSE)

package/index.d.ts

@@ -1,6 +1,8 @@
 interface FederationStatsPluginOptions {
-  fileName: string;
-  publicUrl: string;
+  /** The name of the output JSON file. Defaults to `"federation-stats.json"`. */
+  fileName?: string;
+  /** An optional public URL to include in the output. */
+  publicUrl?: string;
 }
 
 declare class FederationStatsPlugin {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "webpack-federation-stats-plugin",
-  "version": "1.0.3-beta.0",
+  "version": "1.1.1",
   "types": "index.d.ts",
   "description": "export module federation stats",
   "main": "FederationStatsPlugin.js",
@@ -24,5 +24,8 @@
     "loadable-components"
   ],
   "author": "Daniel Amenou <amenou.daniel@gmail.com>",
-  "license": "MIT"
+  "license": "MIT",
+  "engines": {
+    "node": ">=22"
+  }
 }