feat(nuxt): support separate server tsconfig

[danielroe]

🔗 Linked issue

resolves #13920

❓ Type of change

• 📖 Documentation (updates to the documentation or readme)
• 🐞 Bug fix (a non-breaking change that fixes an issue)
• 👌 Enhancement (improving an existing functionality like performance)
• ✨ New feature (a non-breaking change that adds functionality)
• 🧹 Chore (updates to the build process or auxiliary tools and libraries)
• ⚠️ Breaking change (fix or feature that would cause existing functionality to change)

📚 Description

Based on the following upstream work in Nitro, unjs/nitro#1021, unjs/nitro#1041 and unjs/nitro#1146, This adds the option of adding an additional ~/server/tsconfig.json with the following content:

{
  "extends": "../.nuxt/tsconfig.server.json"
}

This will prevent Vue-only auto-imports from being visible within Nitro server routes (so, for example, useNuxtApp or useCookie will be marked as undefined).

There is a current limitation in that Nitro auto-imports are still globally visible within the Vue part of the app, which currently seems to be necessary in order for $fetch type inference to work. (Ideas welcome on this!)

📝 Checklist

• I have linked an issue or discussion.
• I have updated the documentation accordingly.

[codesandbox]

  Open in CodeSandbox Web Editor | VS Code | VS Code Insiders

[Atinux]

Would it be easier if we have a separation with app/ and server/ directory or it won't change anything?

[pi0]

To avoid making it a breaking change for type support shall we try to detect server/tsconfig.json and optionally ignore (also make a warning to enable file?)

[pi0]

Would it be easier if we have a separation with app/ and server/ directory or it won't change anything?

Finally with new structure exactly it would probably be much better to also have app specific config IMO that isolates nuxt auto imports within the dir (local modules for example should not see them in auto complete list...)

[danielroe]

Separating app/ and server/ with the current implementation wouldn't make any difference as the issue is that we need the nitro auto-imports within scope of the Vue app in order for type inference to work. My current best hope is that I can set up a TS partition setup (which would be aided by app/server separation).

[danielroe]

The current limitation is that the IDE will correctly show errors but running vue-tsc doesn't test the separate server directory - its tests are being run solely in the root directory.

I still think this is worth merging, and we can iterate for a better way for users to typecheck their server code separately.

[pi0]

Nice. LGTM. I have some ideas about internal renamings (specifically to isolate nitro's build dir) but i think we can make it done with backward compatibility and iterate.