[Vuejs]-Nuxt, VueJS This must be called within a setup function

From my experience, npm can’t install @nuxtjs/composition-api older versions, or something like that, so I did uninstall its older version and install the new version and it’s worked

here is what I’ve done

rm -rf node_modules && rm -rf package-lock.json && npm uninstall @nuxtjs/composition-api && npm i @nuxtjs/composition-api && npm i

From the look of things, it seems you

• You created another plugin for the VueCompositionAPI when it is installed already e.g @nuxtjs/composition-api

I would advise you to remove any other composition-api from your project and stick to the latest version of the official @nuxtjs/composition-api with Vuex v4 for Nuxt 2

In the latest version of @nuxtjs/composition-api, you could use

const store = useStore();
// OR
const { store } = useContext();

NOTE: You have to define the helper functions like const router = useStore() directly inside your setup() function, and not inside your method, to avoid This must be called within a setup function error.

For those that want to use route

To smooth your upgrade to Nuxt 3, it is recommended not to access route, query, from and params from useContext but rather to use the useRoute helper function.

In my case, I faced this error while converting a mixin file into a composable function. It got fixed when I used useContext inside the function and not out.

Instead of this

import { useContext } from '@nuxtjs/composition-api'
const { $device } = useContext()

export const usePreload = () => {
... // rest of the code
}

Changed to this

import { useContext } from '@nuxtjs/composition-api'

export const usePreload = () => {

... // rest of the code
}

I don’t know what happened there. I deleted that repository and cloned it again.
Next up I did this:
npm init
and then
npm run dev
And it works.