Prompt Buddy logoPrompt Buddy

vite · Vite Docs

Vite Vite HMR API

Explains how to use the Hot Module Replacement (HMR) API to implement custom update logic for modules during development.

Import to Prompt Buddy

Derived skill

Files assembled from official documentation

Viewing SKILL.md

Vite Vite HMR API

Explains how to use the Hot Module Replacement (HMR) API to implement custom update logic for modules during development.

When To Use

Use when implementing custom HMR logic to update specific application state or DOM elements without a full page reload during development.

Reference Files

FileContainsUse For
SKILL.mdEntry point: scope, routing table, and workflow.Start here.
docs/vite-hmr-api-workflow-guide.mdA technical guide detailing the client-side HMR API for Vite, including hot.accept usage and conditional guards.Questions about a technical guide detailing the client-side HMR API for Vite, including hot.accept usage and conditional guards.
examples/vite-hmr-api-interface-definitions.textTypeScript interface definitions for ViteHotContext and ImportMeta used in the Hot Module Replacement API.Exact payloads, commands, or snippets shown in TypeScript interface definitions for ViteHotContext and ImportMeta used in the Hot Module Replacement API.
examples/vite-hmr-api-javascript-implementation.textA JavaScript code example demonstrating the use of the import.meta.hot API for implementing Hot Module Replacement in Vite.Exact payloads, commands, or snippets shown in A JavaScript code example demonstrating the use of the import.meta.hot API for implementing Hot Module Replacement in...
examples/vite-hmr-api-tsconfig-client-types.textA tsconfig configuration snippet including vite/client types for HMR API support.Exact payloads, commands, or snippets shown in A tsconfig configuration snippet including vite/client types for HMR API support.
examples/vite-hmr-api-module-accept-javascript.textA JavaScript code example demonstrating how to use the import.meta.hot.accept API to handle module updates in Vite.Exact payloads, commands, or snippets shown in A JavaScript code example demonstrating how to use the import.meta.hot.accept API to handle module updates in Vite.
examples/vite-hmr-api-import-meta-hot-accept.textA code example demonstrating how to use the import.meta.hot.accept API to handle module updates in Vite.Exact payloads, commands, or snippets shown in A code example demonstrating how to use the import.meta.hot.accept API to handle module updates in Vite.
examples/vite-hmr-api-javascript-dispose-side-effect.textA JavaScript code example demonstrating how to use the import.meta.hot.dispose API to clean up side effects during Vite Hot Module Replacement.Exact payloads, commands, or snippets shown in A JavaScript code example demonstrating how to use the import.meta.hot.dispose API to clean up side effects during Vi...
examples/vite-hmr-api-setup-or-reuse-side-effect.textA JavaScript code example demonstrating how to use the import.meta.hot API to setup or reuse side effects during Hot Module Replacement.Exact payloads, commands, or snippets shown in A JavaScript code example demonstrating how to use the import.meta.hot API to setup or reuse side effects during Hot...
examples/vite-hmr-api-import-meta-hot-data-usage.textAn example demonstrating the correct way to update the import.meta.hot.data object in the Vite HMR API.Exact payloads, commands, or snippets shown in An example demonstrating the correct way to update the import.meta.hot.data object in the Vite HMR API.
examples/vite-hmr-api-module-accept.textA code example demonstrating how to use the import.meta.hot.accept method to handle module updates in Vite.Exact payloads, commands, or snippets shown in A code example demonstrating how to use the import.meta.hot.accept method to handle module updates in Vite.

What This Skill Covers

  • Are you an LLM? You can read better optimized documentation at /guide/api-hmr.md for this page in Markdown format
  • Main sections: Required Conditional Guard ​, IntelliSense for TypeScript ​, hot.accept(cb) ​, hot.accept(deps, cb) ​, hot.dispose(cb) ​.

Workflow

  1. Open the most relevant file under docs/ for the exact documented workflow and wording.
  2. Open schemas/ files for exact structured contracts.
  3. Open examples/ files for concrete requests, commands, snippets, and manifests.
  4. Do not add behavior or configuration that is not present in the attached source files.

Canonical source: https://vite.dev/guide/api-hmr