Skip to content

Here is the translated English version of the document:


Usage Examples

Assume you have the following file structure:

src/
  |- index.js

Configure as follows:

typescript
import { defineConfig } from 'vite';
import vitePluginHookUse from 'vite-plugin-hook-use';

export default defineConfig({
  plugins: [
    vitePluginHookUse()
  ]
});

Run the following command:

bash
vite build

The console will output the following content, where numbers indicate the call count:

bash
   === Start === 

  config(1)

  configResolved(1)

  options(1)

  buildStart(1)

  load(1)

  transform(1)

  moduleParsed(1)

  buildEnd(1)

  outputOptions(1)

  renderStart(1)

  banner(1)

  footer(1)

  intro(1)

  outro(1)

  renderChunk(1)

  generateBundle(1)

  writeBundle(1)

  closeBundle(1)

   === End ===

Explanation:

  • The plugin tracks and displays all Vite hook functions invoked during the build process.
  • Each line shows the hook name followed by its call count in parentheses.
  • The output helps visualize the execution sequence and frequency of Vite's internal hooks.