[Vue TS Plugin] The tsconfig selected for root file and external file is inconsistent

[johnsoncodehk]

Acknowledgement

• I acknowledge that issues using this template may be closed without further explanation at the maintainer's discretion.

Comment

Issues: vuejs/language-tools#3951, vuejs/language-tools#1815

For the root file, tsserver selects the last matching tsconfig in the list of tsconfig references for it.
But for external files, tsserver selects the first matching tsconfig in the list of tsconfig references for it.

Steps to reproduce

1. Clone segevfiner/vite-issue-1815
2. Open the repo in VSCode, install marketplace.visualstudio.com/items?itemName=Vue.volar 2.0.4
3. Open apps/web/src/main.ts, and check the tsconfig at status bar, it's apps/web/tsconfig.app.json
   
4. Open apps/web/src/App.vue, and check the tsconfig at status bar, it's apps/web/tsconfig.vitest.json, but expected same as apps/web/src/main.ts
   

[sheetalkamat]

This is working as intended per configuration.

When we lookup apps/web/tsconfig.json: main.ts is marked as root of referenced from referenced directly but part of referenced project = { "key": "c:/temp/vite-issue-1815/apps/web/src/main.ts", "value": "c:/temp/vite-issue-1815/apps/web/tsconfig.app.json" } but not app.vue because the config file for referenced projects isnt returning the vue files.. They are part of projects as external files but not as "config" file names which results in discrepancy in how ts files are treated vs vue files.

This can be fixed by plugin by setting extraFileExtentions through ConfigureRequest : https://github.com/microsoft/TypeScript/blob/main/src/server/protocol.ts#L1496

Eg i passed this command to server before opening the file and app.vue works same as main.ts

{ "seq": 1, "type": "request",      "command": "configure", "arguments": { "extraFileExtensions": [{ "extension": ".vue", "isMixedContent": false, "scriptKind": 7 }] }}