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

Using fullTemplateTypeCheck flag in the typescript angularCompilerOptions raise an error #150

Closed
maxailloud opened this issue Mar 8, 2018 · 9 comments · Fixed by #152
Closed

Comments

@maxailloud
Copy link

I was updating the angularCompilerOptions in my tsconfig.json file for an external module I am developing and here is the error I got when I turned on the fullTemplateTypeCheck:

Error: Command failed: ngc -p /Users/max/workspace/core/.tmp
../node_modules/angular2-toaster/src/toaster-container.component.d.ts.ToasterContainerComponent.html(8,17): : Element implicitly has an 'any' type because type 'Object' has no index signature.
../node_modules/angular2-toaster/src/toaster-container.component.d.ts.ToasterContainerComponent.html(5,17): : Element implicitly has an 'any' type because type 'Object' has no index signature.

I guess the compiler doesn't like the use of the any type at line 86 and 87 of the toaster-container.component.

I am saying that because in the AoT documentation of Angular for this option it's written

Note: It is recommended to set this to true as this option will default to true in the future.

So maybe it might be a good idea to see to fix this.

@Stabzs
Copy link
Owner

Stabzs commented Mar 8, 2018

This is actually a duplicate of #148 and Andrew was kind enough to create a PR for the fix which I'll fold in.

That said, this is useful because it explains why I missed it...I didn't know about the fullTemplateTypeCheck flag and I did NOT turn it on. I'll make sure to add that to the AOT compilation so that these issues are preemptively caught going forward.

Thanks!

@maxailloud
Copy link
Author

Oh I didn't see this one my bad.
Ok perfect.

You are welcome.

@Stabzs
Copy link
Owner

Stabzs commented Mar 8, 2018

No problem at all and again, thanks for pointing out the flag. This will get folded into a release today.

@Stabzs
Copy link
Owner

Stabzs commented Mar 9, 2018

@maxailloud could you give me a very specific example of exactly how to generate the compiler warnings? I've spun up new angular-cli projects running against 1.7.1 and 1.7.3 and I can't seem to generate the warning. Thanks!

@maxailloud
Copy link
Author

I am using https://www.npmjs.com/package/ngm-cli to build an external module for my applications, basically it's a wrapper for ngc. An so I am not using angular-cli in this project.

Adding the compiler options in my tsconfig.json raised the error:

{
    "compilerOptions": {
        "outDir": "../dist",
        "target": "es5",
        "module": "es2015",
        "moduleResolution": "node",
        "emitDecoratorMetadata": true,
        "experimentalDecorators": true,
        "removeComments": true,
        "sourceMap": true,
        "inlineSources": true,
        "noEmitHelpers": false,
        "noImplicitAny": true,
        "declaration": true,
        "skipLibCheck": false,
        "stripInternal": true,
        "noUnusedLocals": false,
        "noUnusedParameters": false,
        "lib": ["es2016", "dom", "es6"]
    },
    "exclude": [
        "node_modules"
    ],
    "files": [
        "./index.ts"
    ],
    "angularCompilerOptions": {
        "skipTemplateCodegen": true,
        "strictMetadataEmit": true,
        "strictInjectionParameters": true,
        "fullTemplateTypeCheck": false,
        "annotationsAs": "static fields",
        "preserveWhitespaces": false
    }
}

I am obviously using the angular-toaster module in one of the few modules in my package.
After I cannot really show you the code, company code, so I hope i can help anyway.

@Stabzs
Copy link
Owner

Stabzs commented Mar 9, 2018

Completely understandable and this is very helpful, thank you!! What mode is ngc running in for your project or are you not passing any sort of flag to ngc?

@maxailloud
Copy link
Author

The only thiing I can tell you is that the command ngc -p /Users/max/workspace/core/.tmp is launch by ngm-cli, among other things. The .tmp folder being the folder where all of my code has been moved and inlined (external template and style).
I get to see the executed command when there is an error like this one, otherwise it's completely transparent to me.

@Stabzs
Copy link
Owner

Stabzs commented Mar 9, 2018

I still can't reproduce this issue with those flags and angular-cli. I'm going to build a sample with ngm-cli and see if I can create a reproduceable example.

I want the example so that I can catch this sort of thing during development going forward. Thanks for the information!

@maxailloud
Copy link
Author

Yeah I think angular-cli and ngm-cli have some difference even though they should both using ngc as compiler. But after angular-cli uses webpack too I think to build, correct me if i'm wrong, the difference might be from that.

Stabzs added a commit that referenced this issue Mar 16, 2018
- Typescript compilation was failing for implicit any conversions for object typings for the configuration of showCloseButton, timeout, iconClasses and typeClasses. The type arguments have been strengthened to make more rigid compilation happy.  This should not affect anyone who was not abusing the expected typed arguments.
Closes #150, closes #148.

- The webpack demo has been rebuilt against `angular2-toaster@5.0.0` and webpack 4.
Closes #147.
@Stabzs Stabzs mentioned this issue Mar 16, 2018
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

Successfully merging a pull request may close this issue.

2 participants