Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Support solution style tsconfig.json files #2612

Open
sapphi-red opened this issue Dec 3, 2024 · 11 comments
Open

Support solution style tsconfig.json files #2612

sapphi-red opened this issue Dec 3, 2024 · 11 comments

Comments

@sapphi-red
Copy link

sapphi-red commented Dec 3, 2024

Description

solution style tsconfig.json files allows to apply different typescript settings to different directories. #2463 added support for project references, but it seems it doesn't work with solution style tsconfig.json files.

Proposed solution

Support solution style tsconfig.json files

Alternatives

No response

Additional Information, eg. Screenshots

Reproduction

  1. Open https://stackblitz.com/edit/vitejs-vite-7tpf5x?terminal=dev
  2. Download it from here image
  3. Open that directory in VSCode with Svelte extension enabled
  4. Open vite.config.ts
  5. Open tsconfig.json
  6. See the errors (Referenced project 'tsconfig.app.json' must have setting "composite": true., Referenced project 'tsconfig.app.json' may not disable emit.) happening
  7. Disable Svelte extension and close all files and reload window
  8. Open vite.config.ts
  9. Open tsconfig.json
  10. No errors happen

1.-3. (same with above)
4. Open src/App.svelte
5. See Cannot find module './assets/svelte.svg' or its corresponding type declarations. shown (I guess tsconfig.app.json is not used)

System Info

VSCode Information
Version: 1.95.3
Commit: f1a4fb101478ce6ec82fe9627c43efbf9e98c813
Date: 2024-11-13T14:50:04.152Z
Browser: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Code/1.95.3 Chrome/128.0.6613.186 Electron/32.2.1 Safari/537.36

Svelte Extension
v109.3.2

@jasonlyu123
Copy link
Member

This is because the include config in tsconfig.app.json doesn't have svelte files. If I add svelte files to include, the error and restart the server, the error is gone.

@sapphi-red
Copy link
Author

Ah, sorry, this part seems to be because of that.

1.-3. (same with above)
4. Open src/App.svelte
5. See Cannot find module './assets/svelte.svg' or its corresponding type declarations. shown (I guess tsconfig.app.json is not used)

The error below still happens with it.

6. See the errors (Referenced project 'tsconfig.app.json' must have setting "composite": true., Referenced project 'tsconfig.app.json' may not disable emit.) happening

@jasonlyu123
Copy link
Member

From my understanding composite is required in project reference. Though yeah, it is mostly related to how tsc -b build and vite might not have the same constraint. But this error is coming from TypeScript itself. It's also from the TSServer and not the svelte language server so it's mostly out of our control.

@alexlafroscia
Copy link

alexlafroscia commented Dec 3, 2024

I've also been wrestling with some errors around "solutions-style" tsconfig files and svelte-check; I can't get it to report errors in files that exist in a referenced project.

If I update the tsconfig.app.json in the linked reproduction environment to include .svelte files, and then intentionally add a type-checking error to App.svelte, by default svelte-check does not surface any errors.

If I instead point svelte-check to the tsconfig.app.json file directly, like this

npx svelte-check --tsconfig ./tsconfig.app.json

then I get the errors I would expect to see!

CleanShot 2024-12-03 at 17 39 59@2x

@jasonlyu123
Copy link
Member

@alexlafroscia. Yes, this is the intended behaviour. In svelte-check, there is no check for project assignments; it's the opposite. You pass in the config path, and svelte-check loads the file included with the config.

@sapphi-red
Copy link
Author

From my understanding composite is required in project reference.

It is not always required (microsoft/TypeScript#60465).

But this error is coming from TypeScript itself. It's also from the TSServer and not the svelte language server so it's mostly out of our control.

The error is coming from TypeScript, but it doesn't happen when the Svelte extension is not enabled. Isn't the extension interacting with TypeScript somehow and making the error here?

@alexlafroscia
Copy link

@jasonlyu123 can you elaborate on what this means?

there is no check for project assignments

I would expect that the tsconfig.app.json could be "found" by svelte-check since it's referenced by the implicitly-used tsconfig.json file. As a user, I would expect that a "solutions style" tsconfig.json like this would allow svelte-check to "crawl" all of the referenced projects and perform the check for each of them, since that's how tsc behaves; I can run tsc -b tsconfig.json (where that config file is a "solutions style" config) and it type-checks all of the referenced projects.

@jasonlyu123
Copy link
Member

svelte-check behaves like tsc without the -b flag. Whatever the config is passed in, we load the files included with "the config" and nothing else. If we want to support this it will probably require another flag similar to the -b flag,

@alexlafroscia
Copy link

alexlafroscia commented Dec 17, 2024

@jasonlyu123 just to understand the implications of this

Whatever the config is passed in, we load the files included with "the config" and nothing else.

Does that mean that only the passed-in config file is used at all?

Say, as an example, I want my test files to be treated with a "looser" configuration than my source files. The two ways I know of for approaching this kind of set-up are:

  1. Using "project references", so that each group has their own tsconfig.json and the tests are able to import the source
  2. Placing a tsconfig.json in tests/tsconfig.json that will apply to the files within that directory

Since the first option doesn't seem supported by svelte-check, that leaves me with the latter option, which also doesn't seem supported from what I can tell; even as I relax the strictness settings in my tests/tsconfig.json file, svelte-check is reporting the same errors that come from the stricter default rules.

This article does a good job of explaining the problems I am trying to solve for my application; I'm just trying to determine if there's some way for svelte-check to work with a pattern like this, or if it's just not possible

@jasonlyu123
Copy link
Member

jasonlyu123 commented Dec 18, 2024

For TypeScript, each tsconfig is its own project. The solution project is no exception. i.e. The files in the referenced project don't belong to the solution project. In tsc without -b and svelte-check, it handles only one tsconfig all the input files for the config file are loaded ancheck. For the solution project, nothing is loaded because the files config is an empty array.

This doesn't mean you can't use project references or a solution project but you currently have to run svelte-check with the exact tsconfig. For example,

svelte-check --tsconfig tsconfig.client.json && svelte-check --tsconfig tsconfig.test.json

If we were to add a flag similar to tsc -b, we'd also have to loop through the projects and check them one by one just that it might be slightly faster because some files could be reused. One of the reasons I am hesitant to add this is that tsc -b is a build flag which involves incremental build and the dependencies between the projects. svelte-check doesn't build anything so it won't t be the same as the -b flag.

@alexlafroscia
Copy link

I see -- Thank you @jasonlyu123! I definitely has some misconceptions about how multiple tsconfig.json files work; thank you for your patience with my questions!

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

3 participants