webpack-modules-graph-plugin
TypeScript icon, indicating that this package has built-in type declarations

1.3.3 • Public • Published

Webpack Modules Graph Plugin

This Webpack plugin generates a visual graph representing the modules in your project, including dependencies, to help you visualize and understand your project's structure better.

Features

  • Generates an interactive graph of your Webpack modules.
  • Offers customizable options to include/exclude specific modules.
  • Provides a clear visual distinction between different types of modules (e.g., project files, node_modules, assets).
  • Supports color customization for module groups through a user interface.
  • Offers a search feature to find specific modules in the graph.

Installation

npm i --save-dev webpack-modules-graph-plugin

yarn add --dev webpack-modules-graph-plugin

Usage

const ModulesGraphPlugin = require("webpack-modules-graph-plugin")

module.exports = {
  plugins: [
    new ModulesGraphPlugin({
      // Options here
      openFile: true, // Open the generated file in the browser
      filename: "modules-graph.html", // Output file
      showOnlyProjectFiles: false, // Customize according to your needs
    }),
  ],
}

Options

filename: Name of the output HTML file containing the graph. showOnlyProjectFiles: Boolean to show only project files, excluding node_modules.

Example

example of the UI interface example of a large graph

Package Sidebar

Install

npm i webpack-modules-graph-plugin

Weekly Downloads

139

Version

1.3.3

License

MIT

Unpacked Size

1.58 MB

Total Files

16

Last publish

Collaborators

  • daniel_amenou