Angular-cli: TS2304: cannot find name "xxx"——after update to rc.0

[wayearn]

Please provide us with the following information:

OS?

Windows 7, 8 or 10. Linux (which distribution). Mac OSX (Yosemite? El Capitan?)

Windows 10

Versions.

Please run ng --version. If there's nothing outputted, please run in a Terminal: node --version and paste the result here:

@angular/cli: 1.0.0-rc.0
node: 6.9.1
os: win32 x64
@angular/common: 2.4.8
@angular/compiler: 2.4.8
@angular/core: 2.4.8
@angular/forms: 2.4.8
@angular/http: 2.4.8
@angular/platform-browser: 2.4.8
@angular/platform-browser-dynamic: 2.4.8
@angular/router: 3.4.8
@angular/cli: 1.0.0-rc.0
@angular/compiler-cli: 2.4.8

Repro steps.

Was this an app that wasn't created using the CLI? What change did you do on your code? etc.

follow update instruction from beta.32 to rc.0

The log given by the failure.

Normally this include a stack trace and some more information.

webstrom failure:

Nothing change just cover the src/app folder.

1. remove global cli and clean cache.
2. install the rc.0
3. use ng new upgrade-project --skip-install to new a update project.
4. copy my src/app folder and paste it into update-project cover the old one.
5. run ng serve works well ,no errors output, but all my file with "confirm","document", etc, got a note.

Mention any other details that might be useful.

If I cancel the settings in webstorm, it works fine.

Webstorm version:
2016.3.3

Anyone the same?

---

Thanks! We'll be in touch soon.

[sinedied]

Same here, seems that it's due to changes with tsconfig*.json files.

[sinedied]

After getting some sweat, I found the workaround:

The new tsconfig.json at the root is the culpirit, as it is it cannot compile the app files properly.

Change it to this and it will work again:

{
  "compileOnSave": false,
  "compilerOptions": {
    "outDir": "./dist/out-tsc",
    "sourceMap": true,
    "declaration": false,
    "moduleResolution": "node",
    "emitDecoratorMetadata": true,
    "experimentalDecorators": true,
    "lib": [
      "es2016",
      "dom"
    ],
    "target": "es5"
  }
}

It was missing the dom lib and a target to properly compile files.

[cexbrayat]

tsconfig now work by inheritance, so tsconfig.app.json is the one used to compile the app, and does include the dom library, that why the CLI compilation is fine.

On the other hand, IDEs are lost with so many files and use the one they find at the root, that's why you see warnings in your app when using the dom, or in your tests (there is now a dedicate tsconfig file for the tests).

This was introduced by https://github.com/angular/angular-cli/commit/69e6c717fd28a71ee771803ee8dfd14a01ed02ff

@filipesilva do you think that IDEs are ever gonna understand the separate tsconfig? Some IDEs don't allow to specify several ones, how will they get that the src files must be compiled with tsconfig.app.json and the tests with tsconfig.spec.json?

[filipesilva]

@sinedied comment is spot on. I forgot to leave the dom lib there at the root. @deebloo's PR will fix it.

@cexbrayat nope, don't think they'll even understand. IDEs will use the top-level one for everything so it will essentially but a mish-mash of all the common parts. It's unfortunate and I wish there was a better solution.

As long we need two tsconfigs in the same folder (app/specs) I don't see a better alternative.

[sinedied]

@cexbrayat @filipesilva AFAIK, Webstorm (and other Jetbrains similar IDEs) use the most top-level tsconfig.json file it finds for a specified folder, so that's why it was working fine until the extra separation and renaming.

Maybe the e2e/app config could be renamed to just tsconfig.json, while keeping the one for the spec like it is (and maybe removing the root tsconfig.json?) would be better so the IDE could catch the correct config (except for unit tests)?

[filipesilva]

@sinedied in that case the IDE would still not catch the correct config for tests (like you said). You'd then have to fiddle with the app tsconfig until it covered both app and unit test files which would leave you were we were before.

So if you have to compromise, it's better to compromise in a central place while making it obvious what each tsconfig does, and making them independent.

[sinedied]

@deebloo I'm afraid just adding the dom library does not fix the issue, you also need to add the target property with a value >= es5 to fix the errors in Webstorm (and other IDEs I think).

[angular-automatic-lock-bot[bot]]

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._}