Typescript duplicated type declarations

Question

I'm experiencing issues with duplicated Typescript type declarations in the following case:

I've got the following dependency tree for my application A:

A->@angular/http:2.3.1
A->B->@angular/http:2.3.1

Both A and B are managed by npm. After running

npm install

the filesystem looks like this:

A/node_modules/
  @angular/http
  ...
  B/node_modules
     @angular/http

The problem seems to be that now there are two type declarations of @angular/http types like Response, or Headers. And somehow the Typescript transpiler seems unable to handle that - resulting in the following error message:

TS2453:The type argument for type parameter 'T' cannot be inferred from the usage. Consider specifying the type arguments explicitly. Type argument candidate 'Response' is not a valid type argument because it is not a supertype of candidate 'Response'. Types of property 'headers' are incompatible. Type 'Headers' is not assignable to type 'Headers'. Types have separate declarations of a private property 'mayBeSetNormalizedName'.

Reading the message, I guess this is a hickup of Typescript not being able to match the duplicated type declarations.

Anybody experienced the same issue? How to handle that problem? How to handle such name collisions?

I know there is this related question: stackoverflow.com/questions/42412938/…. The answer's not really satisfactory, because in my case I cannot (do not want to) simply move the sources from B into A. There must be another way. — Robert
– Robert, Commented Mar 20, 2017 at 17:13

Robert · Accepted Answer · 2017-09-04 12:15:57Z

4

Meanwhile I found out that you can fix this error by explicitly importing the according types inside the using class of A. In my case (cp. error message above), I needed to:

import {Response, Headers} from '@angular/http';

edited Sep 4, 2017 at 12:15

answered Jul 10, 2017 at 9:21

Robert

1,9702 gold badges21 silver badges40 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Robin Dijkhof · Accepted Answer · 2017-03-20 18:57:36Z

2

I had the same problem. There are basically two ways to solve this.

Make a UMD module of project B. This might take a lot of time
use as any as TheRequiredObject see below.

Let assume you got this class in project b:

export class B{
    getSome(): Observable {
        return this.http.get('some_url');
    }
}

and this is what you want in project a:

export class A{
    getSomeFromB: Observable{
        return B.getSome() as any as Observable;
    }
}

answered Mar 20, 2017 at 18:57

Robin Dijkhof

19.3k14 gold badges72 silver badges127 bronze badges

Collectives™ on Stack Overflow

Typescript duplicated type declarations

2 Answers 2

Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related