How to use defined stores inside a npm package?

[keygun-development]

Thanks for creating Pinia! I've been using it instead of Vuex for my projects now.

I was wondering how I could use a "defined Pinia store inside of a npm package" in my project.
I'm creating a npm package with Pinia inside and defined an ErrorStore. I'm importing the store and want to use it in the app.
I think I've done everything correctly, but maybe I'm missing something. Because I'm getting the following error:
Uncaught (in promise) Error: [🍍]: getActivePinia was called with no active Pinia. Did you forget to install pinia?

I've seen something related to this question on SO here. I don't think the answer is a good solution to this problem.

For some more information here is roughly what I'm doing:

// Defining the store inside the package
import { defineStore } from 'pinia';

export const useCounterStore = defineStore('counter', {
  state: () => ({ count: 0, name: 'Eduardo' }),
  getters: {
    doubleCount: (state) => state.count * 2,
  },
  actions: {
    increment() {
      this.count++
    },
  },
})

// Export the store from the package
import {useCounterStore} from "./store/counter";

export { useCounterStore }

And in my project I'll first call the createPinia() use it in the createApp() and in my App.vue I'll import the useCounterStore
Here is an example:

// ./src/main.ts
import {createApp} from 'vue'
import App from './App.vue'
import {createPinia} from "pinia";

const pinia = createPinia()

const app = createApp(App)
    .use(pinia);

// ./src/App.vue

<script setup lang="ts">
import { useCounterStore } from "my-package";

const counterStore = useCounterStore();
</script>

Any help to this problem would be appreciated! If this is not possible let me know and I'll just create the store in the project itself however it seems to me like the simple solution.

[posva]

Thanks!
This seems to be a duplicate of #2051

[posva]

https://github.com/vuejs/pinia/discussions?discussions_q=pinia+library