跳至内容

HMR(热模块替换)

Pinia 支持热模块替换,因此您可以直接在应用程序中编辑 Store 并与之交互,而无需重新加载页面,从而允许您保留现有状态,添加或甚至删除状态、Action 和 Getter。

目前,只有 Vite 受到官方支持,但任何实现 import.meta.hot 规范的打包器都应该可以工作(例如,webpack 似乎使用 import.meta.webpackHot 而不是 import.meta.hot)。您需要在任何 Store 声明旁边添加这段代码片段。假设您有三个 Store:auth.jscart.jschat.js,您需要在创建Store 定义之后添加(并调整)这段代码:

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

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

// make sure to pass the right store definition, `useAuth` in this case.
if (import.meta.hot) {
  import.meta.hot.accept(acceptHMRUpdate(useAuth, import.meta.hot))
}