Unable to override typings

[mgroenhoff]

I'm having trouble redirecting the lookup of certain typings to a custom directory. The reason i want this is because when i find an error in an at-types module and i issue a pull-request, it usually takes a while before it is reviewed, merged and published etc. In the meanwhile i want to use the version that i modified until the fix is merged and i can depend on the original at-types module again.

I would copy the @types/<package-name>/index.d.ts to a custom directory and edit that. Then i would remove the dependency by removing it a-la npm rm @types/<package-name>

In the case where no other packages depend on that same at-types package this works fine but the problem surfaces when one does depend on that same module that i edited.

TypeScript Version: 2.0.3

Let's say we have a project called temporary-types.

temporary-types/package.json

{
  "name": "temporary-types",
  "version": "0.0.1",
  "main": "lib/index.js",
  "devDependencies": {
    "typescript": "^2.0.3"
  },
  "dependencies": {
    "@types/react-dom": "^0.14.17",
    "react": "^15.3.2",
    "react-dom": "^15.3.2"
  }
}

temporary-types/tsconfig.json

{
    "compilerOptions": {
        "baseUrl": "",
        "paths": {
            "*": [
                "types/*"
            ]
        },
        "target": "es5"
    },
    "files": [
        "index.ts"
    ]
}

temporary-types/index.ts

import * as React from "react";
import * as ReactDOM from "react-dom";

ReactDOM.render(React.DOM.div("Hello, world!"), document.body);

temporary-types/types/react/index.ts

// This file can be modified but for simplicity contains the exact same contents as the original @types/react/index.d.ts file.

If i compile this i get the following result:

$ ./node_modules/.bin/tsc
node_modules/@types/react/index.d.ts(7,21): error TS2300: Duplicate identifier 'React'.
types/react/index.d.ts(7,21): error TS2300: Duplicate identifier 'React'.

$ ./node_modules/.bin/tsc --traceResolution | grep @types/react/index.d.ts
'package.json' has 'typings' field 'index.d.ts' that references 'C:/Source/temporary-types/node_modules/@types/react/index.d.ts'.
File 'C:/Source/temporary-types/node_modules/@types/react/index.d.ts' exist - use it as a name resolution result.
======== Type reference directive 'react' was successfully resolved to 'C:/Source/temporary-types/node_modules/@types/react/index.d.ts', primary: true. ========
======== Resolving module 'global' from 'C:/Source/temporary-types/node_modules/@types/react/index.d.ts'. ========
node_modules/@types/react/index.d.ts(7,21): error TS2300: Duplicate identifier 'React'.

I guess it could work if i do the same thing to all the packages that depend on the modified package and then recursively but this is not a solution.

PS: This issue probably needs a better title.

[mhegazy]

By default all the files in node_modules\@types are included in your project. this is why you are getting the duplicate identifier errors.

You can override what types to include by setting "types": [ "react" ] for instance. this will only load node_modules\@types\react for instance but nothing else. you can also change the location where these are loaded using typeRoots. see http://www.typescriptlang.org/docs/handbook/tsconfig-json.html#types-typeroots-and-types for more details.

[mgroenhoff]

Ok, yes i get that and it works now somehow. But it seems i need to include the baseUrl + paths otherwise the typeRoots + types seem to have no effect.

The following does not work and import from 'react' resolves to node_modules/@types/react/index.d.ts instead of types/react/index.d.ts

{
    "compilerOptions": {
        "target": "es5",
        "typeRoots": [
            "types"
        ],
        "types": [
            "react"
        ]
    },
    "files": [
        "index.ts"
    ]
}

This does work somehow.

{
    "compilerOptions": {
        "baseUrl": "",
        "paths": {
            "*": [
                "types/*"
            ]
        },
        "target": "es5",
        "typeRoots": [
            "types"
        ],
        "types": [
            "react"
        ]
    },
    "files": [
        "index.ts"
    ]
}

[mgroenhoff]

I also noticed that global augmentation is being resolved as a module. Is this correct?

======== Resolving module 'global' from 'C:/Source/temporary-types/types/react/index.d.ts'. ========
Module resolution kind is not specified, using 'NodeJs'.
'baseUrl' option is set to 'C:/Source/temporary-types', using this value to resolve non-relative module name 'global'
'paths' option is specified, looking for a pattern to match module name 'global'.
Module name 'global', matched pattern '*'.
Trying substitution 'types/*', candidate module location: 'types/global'.
Loading module as file / folder, candidate module location 'C:/Source/temporary-types/types/global'.
File 'C:/Source/temporary-types/types/global.ts' does not exist.
...
File 'C:/node_modules/@types/global/index.d.ts' does not exist.
======== Module name 'global' was not resolved. ========

[mgroenhoff]

@mhegazy This issue may be closed as the original problem has been somewhat solved. If you don't have any thoughts about my two last comments feel free to shut this one down.

[mhegazy]

I also noticed that global augmentation is being resolved as a module. Is this correct?

nope. this is a bug. thanks for the report. filed #11754 to track it.

[mhegazy]

Ok, yes i get that and it works now somehow. But it seems i need to include the baseUrl + paths otherwise the typeRoots + types seem to have no effect.

yes. issue #11137 tracks fixing this. we should have a fix for this soon.