nuxt: Nuxt instance unavailable on all pages

@leccyril That’s a deliberate choice: #4016 (comment). Glad things are working for you after upgrade 😊

@tiborpino Are you still encountering this? Could you provide any answers to #4287 (comment)?

I’ve identified two problems and the error is now fixed

1. We used to import like this import { useRuntimeConfig } from ‘#nitro’ - now not needed
2. We use useRuntimeConfig outside defineNuxtPlugin

const config = useRuntimeConfig()
export default defineNuxtPlugin(() => {}

moved inside function solved the error

export default defineNuxtPlugin(() => {
    const config = useRuntimeConfig()
}

useNuxtApp() and useRuntimeConfig() can currently be defined freely outside of the setup function, making it difficult to notice errors. Due to this error, incidents have occurred in my team. In the future, it would be desirable to be able to detect such errors with Nuxt-specific ESLint or similar tools.

You should now just run useRuntimeConfig() without an import: https://v3.nuxtjs.org/guide/features/runtime-config#server-routes

@Horpey thanks for the hint - it almost works now, the error is gone but I get a 404 on all pages (but doesn’t happen on dev). I think I should be able to figure out this part myself.

Edit: the 404 is actually not a problem, one of the items I have are indeed not reachable. What happens now is that I end up with a white page AND an api call is happening locally anyway.

Edit2: ok, the white page is because apparently I can’t use the ref directly and I need to use ref.value 🤷 The html is now rendered correctly, only problem is the extra local api call. I think I saw a ticket about this somewhere…

If you have any imports in your component file from nuxt/app or #app, you can remove them, try to run the app and also generate it again to see if the error is gone.

No, I don’t believe these are the same issue.

You should run it outside of useAsyncData and use the configuration within it.

Are you ever using it outside of a component setup, nuxt plugin or middleware? I want to know what is at this point:

  at $id_bbf8dc5e (./.nuxt/dist/server/server.mjs:41328:38)  

(The bit that is calling useRuntimeConfig.)

nuxt/bridge#18 is got same error. Is there a possibility of being related?

Now we are on 3.0.0-27497374.59593a0 version and getting error on the browser.

{
  "statusCode": 404,
  "statusMessage": "Not Found",
  "stack": []
}

On the client side still the same

[nuxt] [request error] nuxt instance unavailable
  at useNuxtApp (./.nuxt/dist/server/server.mjs:602:13)  
  at Module.useRuntimeConfig (./.nuxt/dist/server/server.mjs:610:10)  
  at $id_bbf8dc5e (./.nuxt/dist/server/server.mjs:41328:38)  
  at async __instantiateModule__ (./.nuxt/dist/server/server.mjs:42741:3)

Some console.log from server.mjs: 597

nuxtAppCtx

nuxtAppCtx:  {
  use: [Function: use],
  set: [Function: set],
  unset: [Function: unset],
  call: [Function: call],
  callAsync: [AsyncFunction: callAsync]
}

const vm = vite_ssr_import_0.getCurrentInstance(); vm: null