Repository navigation
Current tsconfig naming is problematic w.r.t. VSCode (and other IDEs) #5175
Description
OS?
archlinux latest
Versions.
@angular/cli: 1.0.0-rc.0
node: 6.10.0
os: linux x64
@angular/common: 4.0.0-rc.1
@angular/compiler: 4.0.0-rc.1
@angular/core: 4.0.0-rc.1
@angular/flex-layout: 2.0.0-rc.1
@angular/forms: 4.0.0-rc.1
@angular/http: 4.0.0-rc.1
@angular/material: 2.0.0-beta.2
@angular/platform-browser: 4.0.0-rc.1
@angular/platform-browser-dynamic: 4.0.0-rc.1
@angular/router: 4.0.0-rc.1
@angular/cli: 1.0.0-rc.0
@angular/compiler-cli: 4.0.0-rc.1
Repro steps.
app created with the cli
Mention any other details that might be useful.
It seems that the choice was made to name tsconfigs as:
./src/tsconfig.app.json./src/tsconfig.spec.json./e2e/tsconfig.e2e.json
All extending ./tsconfig.json.
The problem with this is well explained in the following tickets of vscode and typescript:
- tsserver (vscode) does not recognize multiple tsconfig.json in the same directory microsoft/TypeScript#8435
- support sub-projects within a single tsconfig.json microsoft/TypeScript#1928
- Possible problem with multiple
tsconfig.jsonfiles in subdirectories microsoft/vscode#10084
Basically, vscode is expecting a file named tsconfig.json in a given directory (and multiple can be used, but in different directories).
Currently what happens with angular-cli, is that only the parent tsconfig.json is used by vscode, and thus libraries are missing because only declared in tsconfig.app.json (or one of the others).
It would make sense to at least rename ./e2e/tsconfig.e2e.json to ./e2e/tsconfig.json and ./src/tsconfig.app.json to ./src/tsconfig.json. Or maybe it is possible to tell vscode this but I didn't find how…
And then, I think we are blocked for now concerning the specs files since they are in the same directory as the app files. In the above issues, Microsoft people recommend to have two directory, one for the tests and one for the application.
Activity
victornoel commentedon Mar 2, 2017
Btw, the same thing happens with other compiler options (such as target!).
edemirkan commentedon Mar 2, 2017
I can confirm. Missing "target": "es5" in tsconfig.json highlighted my accessors as syntax errors.
victornoel commentedon Mar 3, 2017
Some of the things requested here were fixed in 1.0.0-rc1 via #5046/#5060 (es5 target and dom lib).
This is still open to questions maybe… not sure. @filipesilva, I see you were the one fixing the above issue, should this be closed or do you think the rest of the issue will result on some actions?
Juansasa commentedon Mar 3, 2017
Still not working for me
victornoel commentedon Mar 3, 2017
@nickiewooster you need to update your project :) I think the bug fix is only for new project.
victornoel commentedon Mar 3, 2017
(I mean updating you tsconfig.json file)
Juansasa commentedon Mar 3, 2017
I dont see anyone mention modifying tsconfig.spec.json.
There were no compilation errors but it will be one when updating a test.
I have to add the "dom" lib to tsconfig.spec.json as well to fix the issue
victornoel commentedon Mar 3, 2017
@nickiewooster sorry, what was your problem originally? Just to be clear :) I thought you had the same one as me with the IDE, not the compilation :)
victornoel commentedon Mar 3, 2017
@nickiewooster also, if you need the dom library for your test, feel free to add it, but if I understood well, from the point of view of default newly created angular project, adding the dom lib to the tests is not needed. It should only be present in the application itself.
Juansasa commentedon Mar 3, 2017
Sorry i was referred here from another thread and got a bit mixed up. You're right the tsconfig modification alone will fix the IDE errors
filipesilva commentedon Mar 3, 2017
@victornoel it was intentional to only have one tsconfig with the a name that would be recognized by the IDE.
This was our solution to the problem where
src/is actually home to two different 'apps': the Angular app and the unit test app. Each need different configuration and we were specialcasing that before with hacks.For the sake of consistency we change all tsconfigs to specify their purpose and left the general tsconfig on top.
There were a couple more solutions we considered but at the end of the day settled on this one because it was the simpler to understand.
Failing to include the es5 target and dom lib was just a mistake on my part though.
victornoel commentedon Mar 3, 2017
@filipesilva ok, thanks for taking the time to explain!
So I guess we can simply close this issue now that it was fixed in rc1 :)
Ionaru commentedon Mar 3, 2017
On compiling, I now get the error
Cannot find namespace 'NodeJS'It references an import of
import Timer = NodeJS.Timer;Is this related? The import and typing worked fine before the tsconfig change.
filipesilva commentedon Mar 3, 2017
@Ionaru you might need to add it to the
typesarray of either app/specs/e2e tsconfig (depending on where you're using it).Ionaru commentedon Mar 3, 2017
It worked when I used
"types": ["node"], thank you.angular-automatic-lock-bot commentedon Sep 6, 2019
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.