A Lib use @vue/reactivity, not use in vue project

[CandyACE]

Now I am writing a library. I have imported @vue/reactivity to achieve reactivity. Then, when using this library in a Vue project, listening to reactive variables is not feasible. The pseudo code is as follows:

Library code

import { reactive } from "@vue/reactivity";

export const CountData = reactive({
  count: 0,
});

Code in the Vue project

<template>
  <div class="about">
    <h1>This is an about page</h1>
    <p>Count: {{ count }}</p>
    <button @click="increment">Increment</button>
  </div>
</template>

<script setup lang="ts">
import { CountData } from 'lib-test'
import { computed } from 'vue';

const count = computed(() => CountData.count)

const increment = () => {
  CountData.count++
}
</script>

The Count in the interface cannot be updated reactively.