[vue-query] Using useQuery composable from separate package

[SagewLivingstone]

Hi all, typically when I use vue-query I bundle my queries into composables so they can be re-used like so:

// user.ts
export function useUser() {
	const query = useQuery(
		{
			queryKey: ["user"],
			queryFn: fetchUser,
		},
	);

	return {
		user: query.data,
		...query,
	};
}

This works great for keeping a data layer separate from the main component code. Recently I've been trying to go a step further and pull these composables into a shared library so multiple Vue apps can use them, to no avail. Example:

- some-shared-library
  - query
    - user.ts
- vue-app
  - App.vue

// App.vue
<script setup lang="ts">
import { useUser } from 'some-shared-library/queries/user';

const user = useUser();
...

With this example, vue-query doesn't believe it's being instantiated within a setup() function, so it throws these errors:

vue-query composable like "useQuery()" should only be used inside a "setup()" function or a running effect scope. They might otherwise lead to memory leaks.
-
[Vue warn] onScopeDispose() is called when there is no active effect scope to be associated with.

Any ideas why useQuery can't grab the setup context in this example?

[SagewLivingstone]

Solved - I had Vue set as a normal dependency instead of a peerDependency in my shared package, so it was creating two Vue instances