New "Solution Style" tsconfig.json file breaks the unused files in most Editors #18040

destus90 · 2020-06-26T09:50:11Z

If we have an unused service, we will run into some Typescript errors in Editors since the unused file isn't really a part of any TypeScript compilation.
VS code

Webstorm

Shall we revert the changes for tsconfig.file?

kyliau · 2020-06-27T16:40:09Z

Please make sure you are using the workspace version of Typescript.
Solution-style tsconfig is not supported by typescript < v3.9.
In vscode, you can select typescript version like so:

destus90 · 2020-06-28T04:55:04Z

@kyliau
Thanks for your suggestion. However, my TypeScript version is set as a workspace version. The real problem here has been described by @alan-agius4 angular/angular#37781 (comment). I have created a repo https://github.com/destus90/angular-v10-issues. It would be nice if you could investigate it (file src/app/foo.service.ts). I found out that adding unused files into tsconfig.app.json files array solves the issue, but it would pain us to manually put all unused files into it. Any further assistance would be appreciated.

alan-agius4 · 2020-06-28T07:44:29Z

We are aware that “unused” files safe are effected as described above.

This is because we have a strict file Inclusion policy in our tsconfig, which results in un-referenced files not being part of correct program.

We’ll be discussing this issue during our meeting this week.

cyrilletuzi · 2020-07-06T11:50:10Z

Hi @alan-agius4, what is the status about this issue? I just discovered it while animating an Angular training and it's a real pain. Any time you create a service, as shown in the screenshot of the initial message, there is an error telling that experimentalDecorators should be set to true.

If it was solved by just using the service somewhere, that would be confusing but quite OK. But to use it, you need to inject the service in some constructor. Before, the service would be part of the IDE suggestions so the import is done automatically, but now the service is not suggested at all so you have to do the import manually, for each service you create.

alan-agius4 · 2020-07-06T12:05:15Z

@cyrilletuzi, we are still evaluating the best course of action to fix this.

I’ll update the issue when we have more details.

LayZeeDK · 2020-07-06T14:14:26Z

If it was solved by just using the service somewhere

Is this a problem in libraries where the exposed services are not used anywhere?

jtsom · 2020-07-06T15:35:06Z

I also ran into this problem in VSCode:

In Angular 10, they introduced "solution-style" tsconfig files: https://angular.io/guide/migration-solution-style-tsconfig

This, however, seems to break auto importing of files and classes, and the quick-fixes for adding imports:

Note that it's showing "no quick fixes available" .. that should be, and it used to be (something like) "... add import of Contact ...". Or ideally, it would have automatically added the import line as soon as I typed line 13.

In the tsconfig.app.json, a standard Angular 10 app has:

{
  "extends": "./tsconfig.base.json",
  "compilerOptions": {
    "outDir": "./out-tsc/app",
    "types": []
  },
  "files": [
    "src/main.ts",
    "src/polyfills.ts"
  ],
  "include": [
    "src/**/*.d.ts"
  ]
}

Once I changed the include like to be:

  "include": [
    "src/**/*.d.ts",
    "src/**/*.ts"
  ]

The quick fix now works, as well as the auto-import of the file:

Unfortunately, adding this to tsconfig.app.json horribly breaks building the application. So that's not a good solution.

This is with both the workspace version and VSCode packaged version of Typescript.

This used to work in Angular < 10. Was this "strict inclusions policy" not a thing before V10?

cyrilletuzi · 2020-07-06T16:10:37Z

For info: as it is really painful for students during my training, as a workaround, I reverted back to pre-Angular 10 config, ie. copy all config from tsconfig.base.json to tsconfig.json and search/replace tsconfig.base.json by tsconfig.json (mainly for extends in other tsconfig.xxx.json).

But then it breaks other features like ng g library (which says no tsconfig.base.json found).

ahasall · 2020-07-07T07:46:54Z

@cyrilletuzi: try adding "extends": "tsconfig.base.json" to the root tsconfig.json file. It may help with editor support and won't break building your libraries.

crfrolik · 2020-07-07T15:50:34Z

For WebStorm support of "solution style" tsconfig, please follow https://youtrack.jetbrains.com/issue/WEB-46368

vdurante · 2020-07-07T16:55:44Z

Same issue here. VSCode not identifying tsconfig.json for new files. It does identify if I declare the component in a module

EDIT > apparently, once you declare your class on a module, vscode becomes aware of it.

jtsom · 2020-07-07T17:00:07Z

Unhelpful comment, but given this https://angular.io/guide/migration-solution-style-tsconfig, do the maintainers even use VS Code or Webstorm? Or do they not bother with the intellisense / auto importing? How did this get out the door with it broken in the popular editors?

alan-agius4 · 2020-07-07T19:55:40Z

@jtsom, I am sorry by the inconvenience caused by this issue.

This feature was available for testing since beta version of CLI version 10 and both issues were not raised until after the final version of the CLI version 10 was released.

In many case auto import, is not effected if you use ng generate commands to generate new components, modules, etc.. this is because new files are always referenced.

Also it’s important to point that there are 2 separate issues here, one being auto imports not working and the other is un-referenced files have diagnostics errors. The first is being tracked #18170

guilhermetod · 2020-07-11T17:03:09Z

I found another issue that might be related to this. I started a project and switched to ESLint from TSLint. However, both through ESLint CLI and in VSCode output:

Parsing error: "parserOptions.project" has been set for @typescript-eslint/parser.
The file does not match your project config: src/client/environments/environment.prod.ts.
The file must be included in at least one of the projects provided

I then switched to the following and stopped the error messages:

 "exclude": [
    "./src/**/*.spec.ts"
  ],
  "include": [
    "./src/**/*.ts",
  ],

mhamri · 2020-07-14T05:05:31Z

+1

how I fixed it, I changed tsconfig.json to this, just note adding include all js and ts won't destroy the build since this file is used for editor

{
  "extends": "./tsconfig.base.json",
  "files": [],
  "references": [
    {
      "path": "./tsconfig.app.json"
    },
    {
      "path": "./tsconfig.spec.json"
    },
    {
      "path": "./e2e/tsconfig.json"
    }
  ],
  "include": ["**/*.ts", "**/*.js"]
}

and the in tsconfig.base.json I added the composite: true

{
  "compileOnSave": false,
  "compilerOptions": {
    "baseUrl": "./",
    "outDir": "./dist/out-tsc",
    "sourceMap": true,
    "declaration": false,
    "downlevelIteration": true,
    "experimentalDecorators": true,
    "moduleResolution": "node",
    "importHelpers": true,
    "target": "es2015",
    "module": "es2020",
    "lib": ["es2018", "dom"],
    "composite": true
  }
}

jtsom · 2020-07-15T16:31:06Z

Is there any movement on this issue? Using VS Code with Angular 10 is difficult at best until this is fixed.

jtsom · 2020-07-15T20:02:55Z

I sure hope something happens here as two related issues on the typescript repo were just closed with no resolution.

then3rdman · 2020-07-18T06:23:22Z

Another bump on this one, rather annoying

jtsom · 2020-07-19T21:50:29Z

@jtsom, I am sorry by the inconvenience caused by this issue.

This feature was available for testing since beta version of CLI version 10 and both issues were not raised until after the final version of the CLI version 10 was released.

Most users don't use beta versions of software, let alone frameworks used to build software. I have been burned by beta versions of Angular in the past, so steer clear. I'm sure I'm not the only one.

In many case auto import, is not effected if you use ng generate commands to generate new components, modules, etc.. this is because new files are always referenced.

I think the more common use case is as I outlined above - create a class and attempt to reference it in a component. Don't see how that was not noticed in development and testing of Angular 10 with this change to the tsconfig files.

Also it’s important to point that there are 2 separate issues here, one being auto imports not working and the other is un-referenced files have diagnostics errors. The first is being tracked #18170

Hopefully something will be fixed soon. As I said, using VSCode now (and apparently Webstorm) is annoying at the least, and difficult at most.

then3rdman · 2020-07-19T23:52:51Z

For the record, at least in Webstorm, i have no no issues with auto import, just the annoying TsLint error 1219. Its also super inconsistent...

alan-agius4 · 2020-07-20T13:30:27Z

We do understand that this is a big inconvenience and we are sorry for that.

We didn't forget about this issue, in fact we have been working on it since it was first reported. We do have some solutions in mind, but these are none trivial fixes especially outside of a non major release as we'd require to create a migration to update all of the TypeScript configuration files.

We needed to do a couple of in-depth investigations to understand the impact and various solutions a bit better especially considering the magnitude of what needs to be changed to fix issues introduced with the solutions style configuration.

We also reached out to the TypeScript team and filed an issue in their tracker which you can view here: microsoft/TypeScript#39632.

then3rdman · 2020-07-21T00:29:51Z

Thanks very much for the transparency! Its great to know we are being supported!

biltongza · 2020-07-21T08:30:43Z

@alan-agius4 are there any fixes you could suggest as interim fixes that improve the situation?

alan-agius4 · 2020-07-21T09:51:59Z

@biltongza, if the issue you are experiencing is the one which is being tracked here, ie: Typescript errors in IDE's such as the experimental decorators. You can try to add the below reference in your tsconfig.json.

   {
     "path": "./tsconfig.base.json"
   }

IMPORTANT: this has to be always last element in the references array. If you will generate/opt-in libraries, app-shell, universal, web-workers or new applications projects. You will need to manually keep moving this as the very last element in the array.

anstarovoyt · 2020-07-21T22:48:59Z

Just a note, on the WebStorm side, we've implemented https://youtrack.jetbrains.com/issue/WEB-46324 as a hotfix but it works only for the upcoming WS2020.2 (at this moment Beta is available)

…jects Following the issues highlighted in https://docs.google.com/document/d/1eB6cGCG_2ircfS5GzpDC9dBgikeYYcMxghVH5sDESHw/edit?usp=sharing and discussions held with the TypeScript team. The best course of action is to rollback this feature. In future, it is not excluded that solution style tsconfigs are re-introduced.. Closes #18040 and closes #18170

…onfig Following the issues highlighted in https://docs.google.com/document/d/1eB6cGCG_2ircfS5GzpDC9dBgikeYYcMxghVH5sDESHw/edit?usp=sharing and discussions held with the TypeScript team. Together with the TypeScript team it was decided that the best course of action is to rollback this feature. In future, it is not excluded that solution style tsconfigs are re-introduced. Closes #18040, closes #18130 and closes #18170

jimmykane · 2020-08-16T15:28:02Z

Is this released? Could we expect a version tag here with the fix? That would be great

jtsom · 2020-08-16T16:13:22Z

It looks like it won't be out until they release 10.1 ... whenever that is.

alan-agius4 · 2020-08-16T16:16:27Z

10.1 is scheduled to be released as stable latest version end of this month/beginning of September.

…

On Sun, 16 Aug 2020 at 18:13, John Tsombakos ***@***.***> wrote: It looks like it won't be out until they release 10.1 ... whenever that is. — You are receiving this because you were mentioned. Reply to this email directly, view it on GitHub <#18040 (comment)>, or unsubscribe <https://github.com/notifications/unsubscribe-auth/AEF74WT4NNB47BQKQNRHZCDSBAATFANCNFSM4OJFODVQ> .

jimmykane · 2020-08-16T18:06:47Z

Thank you!

kumaravnish · 2020-09-09T21:32:09Z

Looks like 10.1 is released, but when I upgrade from 10.0.x to 10.1.x I get the following error:

❯ Removing "Solution Style" TypeScript configuration file support.
✖ Migration failed: Could not read 'tsconfig.json'.
See "/private/var/folders/lm/bljksptx3zz_ymcg2qv0t66w0000gn/T/ng-tF6sg8/angular-errors.log" for further details.

Looks like the script is trying to check for the existence of tsconfig.json, but it fails because it does not exist. Has anyone else experienced this?

destus90 · 2020-09-10T03:34:09Z

@kumaravnish I guess it is something like #18744 (comment). I have updated my project to Angular 10.1 and the migration went well.

kumaravnish · 2020-09-10T23:32:23Z

@destus90, yes I have similar issue as #18744 (comment), but there is no solution there.

For you, are you upgrading from angular 10.0.x to 10.1? Did you already have tsconfig.json file?

destus90 · 2020-09-11T03:31:51Z

@kumaravnish
Yes, I migrated from 10.0.x to 10.1 and tsconfig.json was in my project.

mhamri · 2020-09-14T16:45:31Z

today I update to 10.1.1 and it's already fixed. after getting a diff on folders noticed the tsconfig.base.json has been removed and path in any other tsconfig.*.json is updated. this is the only major change other than the typescript 4 support

eranshmil · 2020-09-23T08:44:26Z

@destus90, yes I have similar issue as #18744 (comment), but there is no solution there.

For you, are you upgrading from angular 10.0.x to 10.1? Did you already have tsconfig.json file?

I had the same issue, so I opened a PR to fix that:
#18851

angular-automatic-lock-bot · 2020-10-24T08:11:10Z

This issue has been automatically locked due to inactivity.
Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

_{This action has been performed automatically by a bot.}

alan-agius4 added area: @schematics/angular freq1: low Only reported by a handful of users who observe it rarely severity5: regression type: bug/fix labels Jun 26, 2020

ngbot bot added this to the Backlog milestone Jun 26, 2020

alan-agius4 added freq3: high and removed freq1: low Only reported by a handful of users who observe it rarely labels Jun 26, 2020

destus90 mentioned this issue Jun 27, 2020

Solution tsconfig not working on library dev or monorepo setup angular/angular#37781

Closed

alan-agius4 self-assigned this Jun 29, 2020

jtsom mentioned this issue Jul 6, 2020

Typescript auto-complete not working in VSCode microsoft/TypeScript#39370

Closed

alan-agius4 mentioned this issue Jul 7, 2020

Issues with importing interfaces created with export interface in Angular and TypeScript 3.9.6 #18170

Closed

kyliau mentioned this issue Jul 10, 2020

Language Service not working out-of-the-box with angular 10 angular/vscode-ng-language-service#844

Closed

alan-agius4 mentioned this issue Jul 14, 2020

refactor(@ngtools/webpack): remove unused files warnings #18247

Closed

alan-agius4 mentioned this issue Jul 17, 2020

Solution style tsconfig impact in Angular 10 microsoft/TypeScript#39632

Closed

IllusionMH mentioned this issue Aug 3, 2020

Typescript service KO in VSCode microsoft/vscode#103836

Closed

alan-agius4 mentioned this issue Aug 7, 2020

Remove solutions tsconfig #18478

Merged

JoostK mentioned this issue Aug 9, 2020

Auto import not working in vs code #18490

Closed

filipesilva closed this as completed in #18478 Aug 12, 2020

TrevorKarjanis mentioned this issue Aug 14, 2020

The build fails due to missing file after upgrade. #18534

Closed

15 tasks

x87 mentioned this issue Sep 18, 2020

NX 10 - Missing "solution style" tsconfig.json makes vscode warn about false errors nrwl/nx#3409

Closed

eranshmil mentioned this issue Sep 22, 2020

fix(@schematics/angular): remove solution style throw an error #18851

Merged

angular-automatic-lock-bot bot locked and limited conversation to collaborators Oct 24, 2020

New "Solution Style" tsconfig.json file breaks the unused files in most Editors #18040

New "Solution Style" tsconfig.json file breaks the unused files in most Editors #18040

Comments

destus90 commented Jun 26, 2020

kyliau commented Jun 27, 2020

destus90 commented Jun 28, 2020

alan-agius4 commented Jun 28, 2020

cyrilletuzi commented Jul 6, 2020

alan-agius4 commented Jul 6, 2020

LayZeeDK commented Jul 6, 2020 • edited Loading

jtsom commented Jul 6, 2020 • edited Loading

cyrilletuzi commented Jul 6, 2020 • edited Loading

ahasall commented Jul 7, 2020

crfrolik commented Jul 7, 2020

vdurante commented Jul 7, 2020 • edited Loading

jtsom commented Jul 7, 2020

alan-agius4 commented Jul 7, 2020 • edited Loading

guilhermetod commented Jul 11, 2020

mhamri commented Jul 14, 2020 • edited Loading

jtsom commented Jul 15, 2020

jtsom commented Jul 15, 2020

then3rdman commented Jul 18, 2020

jtsom commented Jul 19, 2020

then3rdman commented Jul 19, 2020

alan-agius4 commented Jul 20, 2020

then3rdman commented Jul 21, 2020

biltongza commented Jul 21, 2020

alan-agius4 commented Jul 21, 2020

anstarovoyt commented Jul 21, 2020 • edited Loading

jimmykane commented Aug 16, 2020

jtsom commented Aug 16, 2020

alan-agius4 commented Aug 16, 2020 via email • edited Loading

jimmykane commented Aug 16, 2020

kumaravnish commented Sep 9, 2020

destus90 commented Sep 10, 2020

kumaravnish commented Sep 10, 2020

destus90 commented Sep 11, 2020

mhamri commented Sep 14, 2020

eranshmil commented Sep 23, 2020

angular-automatic-lock-bot bot commented Oct 24, 2020

LayZeeDK commented Jul 6, 2020 •

edited

Loading

jtsom commented Jul 6, 2020 •

edited

Loading

cyrilletuzi commented Jul 6, 2020 •

edited

Loading

vdurante commented Jul 7, 2020 •

edited

Loading

alan-agius4 commented Jul 7, 2020 •

edited

Loading

mhamri commented Jul 14, 2020 •

edited

Loading

anstarovoyt commented Jul 21, 2020 •

edited

Loading

alan-agius4 commented Aug 16, 2020 via email •

edited

Loading