TypeScript - Cannot import self in types override in other types root, TS7016

Question

I am working with FeathersJS and TypeScript. As it is still under development (TS for Feathers) I found that I need to override types for that to be able to adjust to my case (e.g. pagination can be disabled or enabled and types should handle it but don't at the moment).

In my tsconfig.json I have the following:

"typeRoots": [                            /* List of folders to include type definitions from. */
      "./types",
      "node_modules/@types"
    ],

The order does not matter as I have tried with node_modules first too.

I put the folder feathersjs__feathers in ./types with just index.d.ts (removed package.json) with exact copy of the types from DefinitelyTyped.

This line is causing the issue: import * as self from '@feathersjs/feathers';

TS7016 could not find a declaration file for module '@feathersjs/feathers'. 'C:/Users/marek/dev/system/api — kopia/node_modules/@feathersjs/feathers/lib/index.js' implicitly has an 'any' type.   Try npm install @types/feathersjs__feathers if it exists or add a new declaration (.d.ts) file containing declare module 'feathersjs__feathers';

I have tried to add the package.json to my folder, like that:

{
  "name": "@types/feathersjs__feathers",
  "version": "0.0.1",
  "types": "index.d.ts"
}

but it does not help with that issue. If I install @types/feathersjs__feathers so it is there in node_modules there is no error, but no matter what order in typeRoots it takes types from that types, not from my override.

Any solutions for that?

Generally the config with ./types and folders with index.d.ts is fine as e.g. for feathers-mongoose I have my own typings there and they are working properly. The issue is just with importing self...

Answer 1

typeRoots only helps the TypeScript compiler find files to load for the types option (or the /// <reference types="..."/> directive) for the benefit of any declare module "..." { ... } and global declarations they contain. But the index.d.ts file for @feathersjs/feathers does not use declare module "..." { ... }; it is intended to be found as a module itself by TypeScript's main module resolution process. That process doesn't honor typeRoots and is hard-wired to look in node_modules/@types when it finds an untyped module in node_modules. To get module resolution to look an additional place, you have to use the baseUrl and paths options:

{
    "compilerOptions": {
        // ...
        "baseUrl": ".",
        "paths": {
            "@feathersjs/feathers": ["types/feathersjs__feathers"]
        }
    }
}

This seems like poor design to me, but the TypeScript team has already said once that the behavior is intentional, so I don't think it's worth filing a bug to ask them to change it.

(I noticed that the Stack Overflow "Related" widget found an answer that does basically answer your question, though IMO it's not as clear as my answer.)