Vue.js 3 + Pinia全局Store报错：getActivePinia无活跃实例

这个错误的核心是Pinia还没被Vue实例挂载激活，就被调用了，移除API调用后恢复正常，说明API请求触发了这个时机问题，具体场景通常是以下几种：

• 模块顶层提前调用Store方法：比如在constants.store.ts或者API请求模块的代码顶层（不是函数内部）直接执行useConstantsStore()，这时候Vue还没完成Pinia的安装流程，自然找不到活跃的Pinia实例。
• Store内部同步执行API请求：比如在constants.store.ts的state初始化、getters定义或者actions的顶层代码里，直接调用了API请求函数，而这个函数又依赖了Pinia的store（或者当前store本身在未激活时就被访问）。因为Pinia的store只有在组件内部调用、或者Vue实例初始化完成后调用才会处于激活状态，同步的顶层代码执行时机太早。
• 循环依赖触发提前加载：比如auth.store.ts、constants.store.ts和API模块之间形成了循环导入，导致模块加载时，某个store在Pinia未初始化的情况下就被执行了。

举个典型的错误示例：

// constants.store.ts 错误写法
import { defineStore } from 'pinia'
import { fetchConstants } from '@/api/constants'

const useConstantsStore = defineStore('constants', {
  state: () => ({
    // 错误：同步调用API并赋值，会触发store的提前访问
    data: fetchConstants()
  })
})

// api/constants.ts 错误写法
import { useAuthStore } from '@/stores/auth.store'
// 错误：模块加载时直接调用store，此时Pinia未激活
const authStore = useAuthStore()

export async function fetchConstants() {
  return await axios.get('/constants', {
    headers: { Authorization: authStore.token }
  })
}

内容的提问来源于stack exchange，提问作者Matteo Cacciola