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

Question

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

Answer 1

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 packages.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.

Answer 2

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.

Answer 3

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"
  ]

Answer 4

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.

Answer 5

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

Answer 6

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';