v1.3.8 - Lint task is throwing many "All imports are unused."

[hardikns]

Note: for support questions, please use one of these channels:

https://forum.ionicframework.com/
http://ionicworldwide.herokuapp.com/

Short description of the problem:

Lint task is throwing many "All imports are unused." kind of error after upgrading to 1.3.8. Some error are false positives.

What behavior are you expecting?

Such false positives should not appear. Not sure if this is issue with tslint version 5.2 or something I need to set in the tslint.json

Steps to reproduce:

1. Create a simple ionic project with one file as under:
2. Do ionic serve

Sample code below causes
ERROR: ..../src/utils/translate-utils.ts[1, 1]: All imports are unused.

translate-utils.ts:

import { Http } from '@angular/http';
import { TranslateHttpLoader } from '@ngx-translate/http-loader';


export function createTranslateLoader(http: Http) {
  return new TranslateHttpLoader(http, './assets/i18n/', '.json');
}

export function _(s:string) {
  return s;
}

tslint.json:

{
  "rules": {
    "no-duplicate-variable": true,
    "no-unused-variable": [
      true
    ]
  },
  "rulesDirectory": [
    "node_modules/tslint-eslint-rules/dist/rules"
  ]
}

Which @ionic/app-scripts version are you using?
1.3.8

Other information: (e.g. stacktraces, related issues, suggestions how to fix, stackoverflow links, forum links, etc)

[kensodemann]

I got this as well when going from v1.3.7 to v1.3.12. After finding your post I verified that indeed the issue would occur when going from v1.3.7 to v1.3.8. Plenty of false positives with "no-unused-variable": true

I haven't found a solution, but as a work-around, I went to an angular-cli project that I have and copied the rules from there, leaving out the codelyzer specific rules. The rules used for that project do not include no-unused-variables but do include a lot more formatting stuff. This had the added benefit of catching some places where I had gotten sloppy with spacing or placement of braces.

FWIW, turning no-unused-variable checking on in the angular-cli project had a similar effect with lots of false positives, so I am guessing that there is an issue with tslint and/or TypeScript language services, but that is only a guess on my part.

Here is what my tslint.json is for now:

{
  "rules": {
        "callable-types": true,
    "class-name": true,
    "comment-format": [
      true,
      "check-space"
    ],
    "curly": true,
    "eofline": true,
    "forin": true,
    "import-blacklist": [true, "rxjs"],
    "import-spacing": true,
    "indent": [
      true,
      "spaces"
    ],
    "interface-over-type-literal": true,
    "label-position": true,
    "max-line-length": [
      true,
      140
    ],
    "member-access": false,
    "member-ordering": [
      true,
      "static-before-instance",
      "variables-before-functions"
    ],
    "no-arg": true,
    "no-bitwise": true,
    "no-console": [
      true,
      "debug",
      "info",
      "time",
      "timeEnd",
      "trace"
    ],
    "no-construct": true,
    "no-debugger": true,
    "no-duplicate-variable": true,
    "no-empty": false,
    "no-empty-interface": true,
    "no-eval": true,
    "no-inferrable-types": true,
    "no-shadowed-variable": true,
    "no-string-literal": false,
    "no-string-throw": true,
    "no-switch-case-fall-through": true,
    "no-trailing-whitespace": true,
    "no-unused-expression": true,
    "no-use-before-declare": true,
    "no-var-keyword": true,
    "object-literal-sort-keys": false,
    "one-line": [
      true,
      "check-open-brace",
      "check-catch",
      "check-else",
      "check-whitespace"
    ],
    "prefer-const": true,
    "quotemark": [
      true,
      "single"
    ],
    "radix": true,
    "semicolon": [
      "always"
    ],
    "triple-equals": [
      true,
      "allow-null-check"
    ],
    "typedef-whitespace": [
      true,
      {
        "call-signature": "nospace",
        "index-signature": "nospace",
        "parameter": "nospace",
        "property-declaration": "nospace",
        "variable-declaration": "nospace"
      }
    ],
    "typeof-compare": true,
    "unified-signatures": true,
    "variable-name": false,
    "whitespace": [
      true,
      "check-branch",
      "check-decl",
      "check-operator",
      "check-separator",
      "check-type"
    ]
  },
  "rulesDirectory": [
    "node_modules/tslint-eslint-rules/dist/rules"
  ]
}

[akaztp]

Same here.
I've read that using typescript 2.4 solves it for tslint.
Unfortunately Typescript 2.4 is incompatible is RxJS5...

[napcat]

I'm facing the same problem.

A lot of false positives. For example by simple importing OnInit and implement it in my class will trow an warning after the compilation saying the OnInt is not being used.

[esase]

I have the same trouble. Ionic team why you didnt test carefully packages before release them?

[JaneDawson]

Unfortunately, the same issue of many unused import warnings occurs with current app-scripts v. 2.0.2

[napcat]

Yes, I'm also on 2.0.2 and having this issue.

global packages:
ionic/cli-utils : 1.5.0
Cordova CLI : 6.5.0
Ionic CLI : 3.5.0

local packages:
ionic/app-scripts : 2.0.2
ionic/cli-plugin-cordova : 1.4.1
ionic/cli-plugin-ionic-angular : 1.3.2
Cordova Platforms : android 6.2.2
Ionic Framework : ionic-angular 3.5.3

System:
Node : v6.11.1
OS : Windows 10
Xcode : not installed
ios-deploy : not installed
ios-sim : not installed
npm : 5.3.0

[AlejandroSilva]

one trick to remove this warning in the import section of our .ts files, is disable temporary the rule 'no-unused-variable at the start of the file, and re-enable after all the imports are done:

// tslint:disable: no-unused-variable
import {a, b,c } from 'something'
// tslint:enable: no-unused-variable

@Component({...}) ...

source: https://palantir.github.io/tslint/usage/rule-flags/

[mburger81]

@AlejandroSilva what do intend wirh re-enable after all imports are done.
The imports are all fine, tslints warning is justieren wrong.

[piwibardy]

Same issue with version 2.1.0

[daveywc]

I am getting the same issue on 2.0.2:

cli packages:

@ionic/cli-plugin-cordova       : 1.5.0 
@ionic/cli-plugin-ionic-angular : 1.4.0
@ionic/cli-utils                : 1.6.0
ionic (Ionic CLI)               : 3.6.0 

global packages:

Cordova CLI : 7.0.1

local packages:

@ionic/app-scripts : 2.0.2
Cordova Platforms  : android 6.2.2 ios 4.4.0 windows 4.4.3
Ionic Framework    : ionic-angular 3.5.3

System:

Android SDK Tools : 26.0.2
Node              : v8.1.2
OS                : Windows 10
npm               : 5.3.0

[Blackbaud-SteveBrush]

I've seen this error fire when the imported class isn't being used appropriately. For example, if I import a class and use it as an interface, TSLint doesn't like it:

Fires the "All imports are unused":

import { MyClass } from './my-class';

export class AnotherClass {
  public instance: MyClass;
  constructor() {
    this.instance = {
        name: 'Dave'
    };
  }
}

Passes TSLint:

import { MyClass } from './my-class';

export class AnotherClass {
  public instance: MyClass;
  constructor() {
    this.instance = new MyClass();
    this.instance.name = 'Dave';
  }
}

So, essentially, the imported class isn't recognized as being used, if it's used incorrectly.

Edit:

In Angular 2x, the EventEmitter requires a type; if the type used is a class, you need to instantiate the returned value (otherwise, TSLint will think MyClass is never used). For example:

public myEmitter = new EventEmitter<MyClass>();
// ...
this.myEmitter.emit(new MyClass({ ... }));
// Or...
this.myEmitter.emit({ ... } as MyClass);

[jczaplew]

Per a comment here, removing declare var * from declarations.d.ts resolved this issue for me.

[daveywc]

@jczaplew Thanks for that.... for me it was removing declare module '*' from declarations.d.ts.