Visualizer Plugin for Farm

Getting Started

To begin, you'll need to install @farmfe/visualizer:

npm install @farmfe/visualizer --save-dev

or

yarn add -D @farmfe/visualizer

or

pnpm add -D @farmfe/visualizer

Configuring the plugin in farm.config.ts:

import { defineFarmConfig } from '@farmfe/core/dist/config';
import visualizer from '@farmfe/visualizer'; //  import the plugin

export default defineFarmConfig({
  compilation: {
    input: {
      index: './index.html'
    },
    output: {
      path: './build'
    }
  },
  plugins: [
    // use the visualizer plugin.
    visualizer({
      // custom options here
    })
  ]
});

Options

• RecordViewerOptions

RecordViewerOptions

Type:

type RecordViewerOptions = {
  /**
   * Specify hostname
   * @default '127.0.0.1'
   */
  host?: string;

  /**
   * Specify port
   * @default 9527
   */
  port?: number;
}

Default: undefined

Credits

Thanks to:

• The vite-plugin-inspect project created by Anthony Fu, inspiring the module analysis feature in Farm's Visualizer.

• The rsdoctor project created by web-infra, influencing the design of Farm's Visualizer.