How do I make Typescript pick up a declaration file?

Question

My file src/auth/ManagementAPI.ts uses Auth0. I need to use my own declaration file and have created src/@types/auth0.d.ts.

However, when I run ts-node, I'm getting this error:

TSError: ⨯ Unable to compile TypeScript:
auth/ManagementAPI.ts(1,69): error TS7016: Could not find a declaration file for module 'auth0'. '/Users/danrumney/WebstormProjects/ohana/node_modules/auth0/src/index.js' implicitly has an 'any' type.
  Try `npm install @types/auth0` if it exists or add a new declaration (.d.ts) file containing `declare module 'auth0';

I've updated my tsconfig.json file to include:

"typeRoots": [
    "./node_modules/@types",
    "./src/@types"
]

My declaration file is like this:

declare module 'auth0' {
  /*...*/
}

Why is this declaration not being picked up?

I've created an example repository here: https://bitbucket.org/ohanapediatrics/so-demo/src/master/

Answer 1

For the typeRoots mechanism to load your declaration file, it needs to be named index.d.ts and placed in a subdirectory of one of the directories listed in the typeRoots option; see the documentation. Based on the typeRoots setting in your repository, you could put the file at src/types/auth0/index.d.ts.

The above will work, but since your declaration file is declaring a module, it would be better practice to set up module resolution to find your declaration file instead of using typeRoots, which is mainly intended for global declarations. To do that, either use baseUrl and paths or create a package.json file for a local npm package named @types/auth0 and register the package in your main package.json file using a relative path.