Skip to content

HMR (Hot Module Replacement)

Pinia는 Hot Module Replacement(HMR)를 지원하므로, 스토어를 수정하고 페이지를 새로 고침하지 않고도 앱에서 직접 상호작용할 수 있습니다. 이를 통해 기존 상태를 유지하면서 상태, 액션, 게터를 추가하거나 제거할 수 있습니다.

현재는 Vite만 공식적으로 지원되지만, import.meta.hot 스펙을 구현한 번들러라면 모두 동작해야 합니다(예: webpackimport.meta.hot 대신 import.meta.webpackHot을 사용하는 것으로 보입니다). 스토어 선언 옆에 아래 코드 스니펫을 추가해야 합니다. 예를 들어, auth.js, cart.js, chat.js 세 개의 스토어가 있다면, _스토어 정의_를 생성한 후에 아래와 같이(적절히 수정하여) 추가해야 합니다:

js
// auth.js
import { defineStore, acceptHMRUpdate } from 'pinia'

export const useAuth = defineStore('auth', {
  // 옵션...
})

// 올바른 스토어 정의(`useAuth`인 경우)를 전달해야 합니다.
if (import.meta.hot) {
  import.meta.hot.accept(acceptHMRUpdate(useAuth, import.meta.hot))
}

모두를 위한 문서 한글화