using useContext() causes error "Error: This must be called within a setup function."

[Schetnan]

Operating system: OS/X
Node-version: 14.18.2
npm version: 6.14.15

Using useContext in page setup function causes:

"Error: This must be called within a setup function."

1). Create new project via: npx create-nuxt-app
2). npm install @nuxtjs/composition-api --save
3). Add to buildModules in nuxt.config.js
{
buildModules: [
'@nuxtjs/composition-api/module'
]
}

4. Update pages/index.vue to the following:

<template>
  <Tutorial/>
</template>

<script>
import { defineComponent, useContext } from '@nuxtjs/composition-api'
export default defineComponent({
  name: 'IndexPage',

  setup() {
    const nuxtContext = useContext()
  }
})
</script>

[Schetnan]

@danielroe When will this fix be available in a general 2.5.x release?

[danielroe]

What do you mean?

[Schetnan]

@danielroe We have lots of projects that now break if we delete our package-lock.json and try to rebuild. ( Due to this issue ). I need to know what versions to point our package.json to so that we will pick up the fix - that closed this issue.

[danielroe]

This fix is available in "^0.33.0".

[Schetnan]

@danielroe How do I fix this for the older 2.5.x versions?

[danielroe]

I'm not really sure what your problem is. Maybe open a new issue with a minimal reproduction?

[Schetnan]

@danielroe I think my origin report should work. Just going to the Nuxt 2 site (docs ) and create a new project as I have highlighted above, installing the @nuxtjs/composition-api, then adding the following in the setup. This problem is in existing nuxt 2 projects - not Nuxt 3 or the bridge.

<template>
  <Tutorial/>
</template>

<script>
import { defineComponent, useContext } from '@nuxtjs/composition-api'
export default defineComponent({
  name: 'IndexPage',

  setup() {
    const nuxtContext = useContext()
  }
})
</script>

[danielroe]

It works fine: https://stackblitz.com/edit/github-k8mxkn

[Schetnan]

@danielroe @xicri
I recreated a clean project with npx create-nuxt-app <project-name>. I then added the latest version of the nuxt composition api and the project worked.

I was able to get one of my other projects working by copying the dependencies from the fresh project over to the older one.

Thanks for sticking with me.

[sppmstar]

I am still experiencing that issue with composition-api v 0.33.1 :(

I tested with a blank project and that works fine... but not in my existing project. This is a production app, so i cannot just start from scratch...

[vuthanhbayit]

I am still experiencing that issue with composition-api v 0.33.1 :(

I tested with a blank project and that works fine... but not in my existing project. This is a production app, so i cannot just start from scratch...

I have the same issue

[jeanmatthieud]

I had the same issue, but was due to the use of "useContext()" in a pinia store.