'How to get rid of the warning .ts file is part of the TypeScript compilation but it's unused

I Just updated angular to latest 9.0.0-next.4. I am not using routing but suddenly after updating I keep seeing this warning. How Do I remove this warning

WARNING in src/war/angular/src/app/app-routing.module.ts is part of the TypeScript compilation but it's unused. Add only entry points to the 'files' or 'include' properties in your tsconfig.

package.json

  "dependencies": {
"@angular/animations": "^9.0.0-next.4",
"@angular/cdk": "^8.1.4",
"@angular/common": "^9.0.0-next.4",
"@angular/compiler": "^9.0.0-next.4",
"@angular/core": "^9.0.0-next.4",
"@angular/forms": "^9.0.0-next.4",
"@angular/material": "^8.1.4",
"@angular/platform-browser": "^9.0.0-next.4",
"@angular/platform-browser-dynamic": "^9.0.0-next.4",
"@angular/router": "^9.0.0-next.4",
"@ng-bootstrap/ng-bootstrap": "^5.1.0",
"bootstrap": "^4.3.1",
"hammerjs": "^2.0.8",
"moment": "^2.24.0",
"ng-image-slider": "^2.0.1",
"panzoom": "^8.1.2",
"rxjs": "~6.5.2",
"tslib": "^1.9.0",
"zone.js": "^0.10.2"
  },
  "devDependencies": {
    "@angular-devkit/build-angular": "^0.803.2",
    "@angular/cli": "^8.3.2",
    "@angular/compiler-cli": "^9.0.0-next.4",
    "@angular/language-service": "^9.0.0-next.4",
    "@types/jasmine": "~3.3.8",
    "@types/jasminewd2": "~2.0.3",
    "@types/node": "~8.9.4",
    "codelyzer": "^5.0.0",
    "jasmine-core": "~3.4.0",
    "jasmine-spec-reporter": "~4.2.1",
    "karma": "~4.1.0",
    "karma-chrome-launcher": "~2.2.0",
    "karma-coverage-istanbul-reporter": "~2.0.1",
    "karma-jasmine": "~2.0.1",
    "karma-jasmine-html-reporter": "^1.4.0",
    "protractor": "~5.4.0",
    "ts-node": "~7.0.0",
    "tslint": "^5.15.0",
    "typescript": "^3.5.3"
  }

tsconfig.json

    {
  "compileOnSave": false,
  "compilerOptions": {
    "baseUrl": "./",
    "outDir": "./dist/out-tsc",
    "sourceMap": true,
    "declaration": false,
    "module": "esnext",
    "moduleResolution": "node",
    "emitDecoratorMetadata": true,
    "experimentalDecorators": true,
    "importHelpers": true,
    "target": "es2015",
    "typeRoots": [
      "node_modules/@types"
    ],
    "lib": [
      "es2018",
      "dom"
    ]
  }
}

Solution 1:^[1]

It turned out that you need to remove this line from "include" "src/**/*.ts" from tsconfig.app.json and only keep entry points in files (main.ts and polyfills.ts)

Solution 2:^[2]

I could get it working by defining the files property in tsconfig.app.json. These files are relative to the tsconfig.app.json file.

"files": [
    "main.ts",
    "polyfills.ts"
  ]

Solution 3:^[3]

I had seen these messages complaining about environment.*.ts files which are actually mentioned in angular.json for different builds, after upgrading from Angular 8 to Angular 9 including CLI local and global. However, I did not run ng update which might update tsconfig.json with the following, instead I updated tsconfig.json manually.

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

Then the warnings disappear.

Update 2020-05-27 with Angular 9.1.x in Visual Studio Professional 2019

The little block above is not needed anymore. Otherwise, it will cause the spec test codes complaining "module not found" against modules which are actually there since ng test is building and running just fine, and the build and the running of the ng app are OK. Apparently somethings in NG had changed between 9 and 9.1.

Here's my working tsconfig.json now:

{
    "compileOnSave": false,
    "compilerOptions": {
        "baseUrl": "./",
        "outDir": "./dist/out-tsc",
        "sourceMap": true,
        "declaration": false,
        "module": "es2020",
        "moduleResolution": "node",
        "emitDecoratorMetadata": true,
        "experimentalDecorators": true,
        "target": "es2015",
        "typeRoots": [
            "node_modules/@types"
        ],
        "lib": [
            "es2018",
            "dom"
        ],
        "skipLibCheck": true
    }
}

remarks:

I target Google Chrome and Safari only, so if you want to target other browsers, you may need to adjust accordingly.

Solution 4:^[4]

Are you using @angular-builders/custom-webpack?

I was getting bombarded with these messages in Angular 10 having never seen them before. Changing includes made no difference.

Then I found https://github.com/angular/angular/pull/36211.

This is essentially the same error as raised in this question but for ngtypecheck.ts files (whatever they are exactly i'm not sure!)

WARNING in /home/circleci/ng/aio/src/main.ngtypecheck.ts is part of the TypeScript compilation but it's unused. Add only entry points to the 'files' or 'include' properties in your tsconfig.

It looks like for me it's actually to do with @angular-builders/custom-webpack.

https://github.com/just-jeb/angular-builders/issues/781 where an issue was only just opened. Thanks to https://stackoverflow.com/a/62573294/16940 for pointing this out.

Updating to the v10.0.1 fixed it for me, but see the above issue for the latest.

"@angular-builders/custom-webpack": "10.0.1"    // as of today

Solution 5:^[5]

This may seem obvious, BUT you will see this warning for any file that you add but is not yet referenced/imported into another file. This will become obvious when you attempt to edit one of the files subject to the warning, and Ivy does not automatically recompile after editing the file. Once you import the module into a dependent file and start using it, the warnings go away.

The answers above may be relevant to some, but what I just described in this post was the root cause of my warnings. Note, I do not have an include or files array in my tsconfig.json or tsconfig.app.json and the warnings went away as soon as I actually referenced the files elsewhere in my project.

Solution 6:^[6]

Updated to Angular 9 today and got warnings. My solution was add this "files" array without the "src" in the path. Just added:

 "files": [
    "main.ts",
    "polyfills.ts"
  ],

My full tsconfig.app.json file is:

{
  "extends": "../tsconfig.json",
  "compilerOptions": {
    "outDir": "../out-tsc/app",
    "module": "es2015",
    "types": ["node"]
  },
  "files": [
    "main.ts",
    "polyfills.ts"
  ],
  "exclude": [
    "src/test.ts",
    "**/*.spec.ts"
  ]
}

Solution 7:^[7]

02-08-2020

Ionic 5+ Angular 9+ App.

Note: see the include section.

tsconfig.app.json

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

Solution 8:^[8]

Just add the zone-flags.ts as well and remove any includes.

 "files": [
    "src/main.ts",
    "src/polyfills.ts",
    "src/zone-flags.ts"
  ]

Solution 9:^[9]

tsconfig.app.json

 "exclude": [
    "src/**/*.spec.ts",
    "src/test.ts",
    "src/environments/environment.prod.ts"
  ]

This snippet solves the issue.

Solution 10:^[10]

after try out the before solutions proposals , it worked for me

update in your package.json

"@angular-devkit/build-angular": "~0.1000.3"

can you see here all versions.

https://www.npmjs.com/package/@angular-devkit/build-angular?activeTab=versions

check which version work with you current version from angular/core

for angular 10 work with version 0.1000.3 of @angular-devkit/build-angular

Solution 11:^[11]

I began to see the warnings in Angular 10 which is a little surprising based on the fact it was a new app created using the CLI out of the box and I got the messages when doing a prod build for test.ts and enviornments.prod.ts. I'd think these files would be excluded by default, but they are not and that's odd.

The deal is these files are not needed for TypeScript transpolation; they don't need .js versions of the files to be bundled and sent to the browser. The test.ts and environments.prod.ts files are a means to an end for build time requirements in Angular. Therefore they can be added to the exclude section in tsconfig.app.json or applicable TypeScript configuration file in your app like below:

  "exclude": [
    "src/**/*.spec.ts",
    "src/test.ts",
    "src/environments/environment.prod.ts"
  ]

Once these are added as above, the warning will not show anymore.

Solution 12:^[12]

After upgrading to Angular 10 I got the same warnings. Running npm i reported version mismatches for some dev dependencies. After upgrading these (npm i <package>@latest), and updating nodejs to version 12 (was version 10), the warnings were gone.

In my case, these were the packages that had to be updated:

@angular-devkit/build-angular
codelyzer

Solution 13:^[13]

In my case, the classes reported by the warning were really used. However, the problem was that when importing them, they had the extension ".js".

So, this line was causing the error "WARNING in src\app\user.service.ts is part of the TypeScript compilation but it's unused":

import { UserService } from './user.service.js';

And I could fixed it by removing ".js" extension:

import { UserService } from './user.service';

Solution 14:^[14]

Try to delete the folder node_modules/.cli-ngcc which includes the Angular CLI cache files.

Solution 15:^[15]

I tried many things to solve this problem, and in the end I was able to solve it.

my problem was updating an app that was found in angular 8.1 to angular 9.x, but the app also used Ionic

you should only have aot: true inside angular.json

in src / polyfills.ts to import './zone-flags.ts'; remove .ts

https://medium.com/@grantbrits/upgrade-ionic-4-to-ionic-5-angular-76514079fb2a enter image description here

Solution 16:^[16]

Check your main tsconfig.app.json file.

and see whether you have following content inside,

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

Most likely, the lines to blame were this.

Add only entry points to the files or include properties in your tsconfig.

So, remove these lines should you have on your tsconfig.app.json. That's what the error is about :)

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

I hope this will help someone.

Thanks.

Solution 17:^[17]

I faced same issue after updating angular 9 app to angular 10. Updating angular-devkit solved it.

Solution 18:^[18]

My team has been banging our head against this same symptom for months, and I finally figured out that our tsconfig.worker.json was too inclusive. In our case hundreds of "part of the TypeScript compilation but it's unused" messages were showing-- it seemed like every ts file in the app was listed, some multiple times.

The way it was:

"include": [
  "src/**/*.worker.ts"
]

What stopped the defective behavior:

"files": [ ]   # no include or exclude block

I think what was happening is that our standard tsconfig.app.json's files object was sufficient. From just those entry points (main.ts & polyfills.ts), the TS compiler was able to find references to all our *.worker.ts files and transpile them. Somehow the tsconfig.webworker.ts configuration was telling the compiler to look twice at all *.webworker.ts files. I'm not quite sure why that explodes into so many warnings; perhaps our webworker files (we have about 20) are unnecessarily importing a bunch of things they don't use.

Anyway, with this tweak, I got rid of the numerous warnings, and our compilation time cut in half. Phew!

Solution 19:^[19]

In my case, it was easier to exclude the non used file :

"exclude": ["test.ts", "**/*.spec.ts","environments/environment.*.ts"]

Solution 20:^[20]

In my scenario, my tsconfig.json was missing the exclude with spec files in it. This is the snippet of my tsconfig file which fixed the issue.

"exclude": [
"**/*.spec.ts",
"./node_modules/*"
],
 "files": [
"src/main.ts",
"src/polyfills.ts"
]

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution	Source
Solution 1	Ayyash
Solution 2
Solution 3	RMD
Solution 4	TetraDev
Solution 5	Matthew Pitts
Solution 6	fabio984
Solution 7	Sampath
Solution 8	feder
Solution 9	J. M. Arnold
Solution 10	Daniel Lopez
Solution 11	atconway
Solution 12	yaba
Solution 13	Dharman
Solution 14	Mark Langer
Solution 15
Solution 16
Solution 17	rodeshifz69
Solution 18
Solution 19	Hasan Daghash
Solution 20	Prashanti.D

'How to get rid of the warning .ts file is part of the TypeScript compilation but it's unused

Solution 1:[1]

Solution 2:[2]

Solution 3:[3]

Solution 4:[4]

Are you using @angular-builders/custom-webpack?

Solution 5:[5]

Solution 6:[6]

Solution 7:[7]

Solution 8:[8]

Solution 9:[9]

Solution 10:[10]

Solution 11:[11]

Solution 12:[12]

Solution 13:[13]

Solution 14:[14]

Solution 15:[15]

Solution 16:[16]

Solution 17:[17]

Solution 18:[18]

Solution 19:[19]

Solution 20:[20]