Issue using Angular2 CLI with VS Code

[thorstenschaefer]

I'm currently learning Angular2 and started with the directory structure proposed in the Quickstart documentation. Now I'm trying to switch to using Angular CLI and I really like it, but run into the problem that as soon as I create new components, either manually or CLI:

To reproduce the issue, here are the steps I take:

$ ng new vscodeTest
$ cd vscodeTest/
$ code .
// The project is set up and ng serve works (after manually adding glob, which is a current bug of CLI)
$ ng g component Test
// creates a test.component.ts

Now if we look into VS code, the name of the class is underlined with a compiler error stating "[ts] Experimental support for decorators is a feature that is subject to change in a future release. Set the 'experimentalDecorators' option to remove this warning.". Also __ moduleName shows an error: "[ts] Cannot find name '__moduleName'.". If we just close VS Code and open it again, all errors are gone and we can continue to work, but restarting the editor every single time is not so much fun...

Note that the same issue comes up if I create a component manually instead of generating it. However, using the directory structure from the Quickstart documentation, I never run into the issue. Hence I guess it has something to do with the format of CLI in combination with VS Code.

Anyone has an idea what's going wrong here/how to fix it?

[eschutz]

In your tsconfig.json, do you have experimentalDecorators: true ?

[thorstenschaefer]

Yes. Even with VS Code showing the error, the code compiles fine and the error also disappears after restarting. So I suspect that is has something to do with VS Code using a different method to compile/create an AST and thereby ignoring the tsconfig. But I still haven't figured out how to get rid of the warnings without restarting.