上传到npm仓库

// src/index.ts
import { PiniaPluginContext } from 'pinia'

// 1. 扩展 Pinia 类型定义
declare module 'pinia' {
  export interface DefineStoreOptionsBase<S, Store> {
    /**
     * Enable state synchronization across Electron windows.
     * @default false
     */
    share?: boolean
  }
}

// 2. 插件配置接口
export interface ElectronShareOptions {
  /**
   * Custom name for BroadcastChannel.
   * Useful if you have multiple apps running on the same domain/protocol.
   * @default 'pinia-electron-share'
   */
  channelName?: string
}

// 3. 消息载荷定义
type SyncPayload = {
  type: 'UPDATE' | 'REQUEST_INIT' | 'RESPONSE_INIT'
  storeId: string
  data?: any
  timestamp: number
}

// 4. 插件主函数
export function createElectronSharePlugin(globalOptions: ElectronShareOptions = {}) {
  const CHANNEL_NAME = globalOptions.channelName || 'pinia-electron-share'
  
  // 创建频道 (由于是广播，可以在插件层级复用一个实例，也可以在 Store 级创建，这里为了简单和性能复用一个)
  const channel = new BroadcastChannel(CHANNEL_NAME)

  return ({ store, options }: PiniaPluginContext) => {
    // 如果 Store 没有开启 share，直接跳过
    if (!options.share) return

    let isExternalUpdate = false

    // --- 消息接收逻辑 ---
    channel.addEventListener('message', (event: MessageEvent<SyncPayload>) => {
      const { type, storeId, data } = event.data

      // 忽略不属于当前 Store 的消息
      if (storeId !== store.$id) return

      switch (type) {
        case 'UPDATE':
          if (!isExternalUpdate) {
            isExternalUpdate = true
            store.$patch(data)
            // 宏任务延迟释放锁，确保 Vue 响应式队列清空
            setTimeout(() => { isExternalUpdate = false }, 0)
          }
          break

        case 'REQUEST_INIT':
          // 收到新窗口的请求，发送当前状态
          channel.postMessage({
            type: 'RESPONSE_INIT',
            storeId: store.$id,
            data: JSON.parse(JSON.stringify(store.$state)),
            timestamp: Date.now(),
          })
          break

        case 'RESPONSE_INIT':
          // 收到初始化数据，应用到当前 Store
          isExternalUpdate = true
          store.$patch(data)
          setTimeout(() => { isExternalUpdate = false }, 0)
          break
      }
    })

    // --- 状态变更监听 ---
    store.$subscribe((mutation, state) => {
      if (isExternalUpdate) return

      try {
        const rawState = JSON.parse(JSON.stringify(state))
        
        channel.postMessage({
          type: 'UPDATE',
          storeId: store.$id,
          data: rawState,
          timestamp: Date.now(),
        })
      } catch (e) {
        console.error(`[pinia-plugin-electron-share] Failed to serialize state for store "${store.$id}". Ensure state is JSON-serializable.`, e)
      }
    })

    // --- 初始化握手 ---
    // 延迟极短时间发送请求，确保监听器已挂载
    setTimeout(() => {
      channel.postMessage({
        type: 'REQUEST_INIT',
        storeId: store.$id,
        timestamp: Date.now(),
      })
    }, 50)
  }
}

// vite.config.ts
import { defineConfig } from 'vite'
import dts from 'vite-plugin-dts'
import { resolve } from 'path'

export default defineConfig({
  plugins: [
    // 自动生成 .d.ts 类型文件
    dts({ 
      include: ['src/**/*.ts'],
      insertTypesEntry: true,
    })
  ],
  build: {
    lib: {
      entry: resolve(__dirname, 'src/index.ts'),
      name: 'PiniaPluginElectronShare',
      fileName: (format) => `index.${format}.js` // index.es.js, index.umd.js
    },
    rollupOptions: {
      // 确保外部化处理那些你不想打包进库的依赖
      external: ['pinia', 'vue'],
      output: {
        // 在 UMD 构建模式下为这些外部化的依赖提供一个全局变量
        globals: {
          vue: 'Vue',
          pinia: 'Pinia'
        }
      }
    }
  }
})

// store/index.ts
import { createPinia } from 'pinia'
import { createElectronSharePlugin } from 'pinia-plugin-electron-share'

const pinia = createPinia()

pinia.use(createElectronSharePlugin({
  // Optional: Custom channel name
  channelName: 'my-app-sync' 
}))

export default pinia

// store/user.ts
import { defineStore } from 'pinia'

export const useUserStore = defineStore('user', {
  state: () => ({ count: 0 }),
  actions: {
    increment() { this.count++ }
  },
  // Enable sync for this store
  share: true 
})