Missing server build import files: Cannot find module '#gql/default' or its corresponding type declarations

[daniluk4000]

Environment

• Operating System: Linux
• Node Version: v16.18.1
• Nuxt Version: 3.0.0
• Nitro Version: 1.0.0
• Package Manager: yarn@1.22.19
• Builder: vite
• User Config: alias, experimental, build, app, sourcemap, dir, typescript, modules, vite, runtimeConfig
• Runtime Modules: (), @pinia/nuxt@0.4.3, nuxt-graphql-client@0.2.12, @vueuse/nuxt@9.5.0
• Build Modules: -

Describe the bug

I've upgraded to Nuxt v3 stable and latest version of lib and updated all imports to #gql. Now it can't build

Works fine in nuxt dev, fails in nuxt build

Expected behaviour

Project builds

Reproduction

No response

Additional context

runtimeConfig: {
        public: {
            'graphql-client': {
                codegen: {
                    onlyOperationTypes: false,
                },
            },
        },
    },

Logs

ℹ Client built in 11342ms
ℹ Building server...
✔ Server built in 8706ms
✔ Generated public .output/public
ℹ Building Nitro Server (preset: node-server)
src/components/views/catalog/CatalogCardPresentation.vue(27,28): error TS2307: Cannot find module '#gql/default' or its corresponding type declarations.

[daniluk4000]

It couldn't be any related to mine #236 right?

[daniluk4000]

@Diizzayy when you will find some time on this? 🙏

[Diizzayy]

@daniluk4000 Apologies for the late reply here, I've attempted to recreate this locally to no avail. Would you be willing to create a basic reproduction of this issue or give me access to the private repo for this project? I'd like to have a closer look to pinpoint the cause here

[daniluk4000]

@Diizzayy I've taken a deep look at this.

Locally, tsconfig entry in paths is

      "#gql": [
        ".nuxt/gql"
      ],
      "#gql/*": [
        ".nuxt/gql/*"
      ],

But in production it's just

      "#gql": [
        ".nuxt/gql"
      ],

I believe that's the reason.

https://github.com/Diizzayy/nuxt-graphql-client/blob/main/src/module.ts#L220

That helped me to create a workaround for myself

export default defineNuxtConfig({
    alias: {
        '#gql/*': '.nuxt/gql/*'
    },
});

And now it's working!

P.S. Reading your code was a pleasure, the job you've done is incredible.

[Diizzayy]

And now it's working!

@daniluk4000 Perfect! Though It's strange that the sub alias for #gql isn't added in the production build, I may have to add it explicitly to prevent others from encountering this.

P.S. Reading your code was a pleasure, the job you've done is incredible.

Thank You! Happy to see that you've been enjoying this module. Much more great features are on the way.

[daniluk4000]

It's strange that the sub alias for #gql isn't added in the production build

I believe it's some Nuxt thing. I'm still struggling with this nuxt instance unavailable, hope it will be resolved by somebody in vue/nuxt team some other day.

Happy to see that you've been enjoying this module

Honestly it's my first time writting GraphQL. As TypeScript lover I'm so glad I found this module.

Much more great features are on the way

waiting.gif

[Diizzayy]

I'm still struggling with this nuxt instance unavailable, hope it will be resolved by somebody in vue/nuxt team some other day.

@daniluk4000 The nuxt context is lost after the first await call, hence any calls to any Nuxt 3 composable (ie: useState) or calls to any function that is depending upon the nuxt context will result in the nuxt instance unavailable error, Note that composables aren't meant to house multiple await calls in that manner, especially if a Nuxt composable is called anywhere after an await ( hence the nuxt instance unavailable error). This is due to a current limitation of Vue 3.

[daniluk4000]

@Diizzayy I've lost context even in plugins/middlewares/asyncData (not setup).

I've tried to migrate my Nuxt 2 project to Nuxt Bridge (not Nuxt 3) and this was a huge breaking change for me. Initially I thought this is only Suspense/setup limitation but it happens everywhere nuxt context is used. I really do hope Vue team will resolve this some day (Vue 3.3 e.t.c.)

[Diizzayy]

@daniluk4000 The setup function is designed specially to avoid the context being lost.

Feel free to reach out to me on discord (Diizzayy#1964), I'd be happy to help you work around the context issues you're facing.