• 首页
  • vue
  • TypeScript
  • JavaScript
  • scss
  • css3
  • html5
  • php
  • MySQL
  • redis
  • jQuery
  • Pinia 热更新

    热更新:(Hot Module Replacement,简写 HMR)代码会自动更新页面。当修改代码时,HMR 能够在不刷新页面的情况下,把页面中发生变化的模块,替换成新的模块,同时不影响其他模块的正常运作。

    Pinia 支持热更新,所以你可以编辑你的 store,并直接在你的应用中与它们互动,而不需要重新加载页面,允许你保持当前的state、并添加甚至删除stateactionsgetters

    目前,只有Vite被官方支持,不过任何实现import.meta.hot规范的构建工具都应该能正常工作。(例外的是,webpack似乎使用的是import.meta.webpackHot而不是import.meta.hot),你只需要在任何 store 声明旁边添加这段代码。比方说,你有三个 store:auth.jscart.jschat.js,你必须在每个 store 声明后都添加(和调整)这段代码。

    // auth.js
    import { defineStore, acceptHMRUpdate } from 'pinia'
    
    const useAuth = defineStore('auth', {
      // 配置...
    })
    
    // 确保传递正确的 store 声明,本例中为 `useAuth`
    if (import.meta.hot) {
      import.meta.hot.accept(acceptHMRUpdate(useAuth, import.meta.hot))
    }