TypeScript is not picking up my custom type definitions in tsconfig

user_12530427 0
Viewed 3341

I'm using tsconfig to check my js files. I have my custom type definitions in the custom_types\custom.d.ts

tsconfig.json

{
  "compilerOptions": {
    "target": "es2020",
    "module": "commonjs",
    "allowJs": true,
    "checkJs": true,
    "outDir": "./dist",
    "strict": true,
    "typeRoots": ["./custom_types/", "node_modules/@types/"],
    "types": ["node"],
    "esModuleInterop": true,
    "skipLibCheck": true,
    "forceConsistentCasingInFileNames": true
  },
  "include": ["src/**/*"]
}

custom_types/custom.d.ts

declare global {
  const foo: string;

  namespace NodeJS {
    interface Global {
      foo: string;
    }
  }
}
export default global;

src/app.js

let bar = foo; // Cannot find name 'foo'.ts(2304)

However when I do this in my tsconfig:

{
  ...
  },
  "include": ["src/**/*", "custom_types/custom.d.ts"]
}

everything work perfect. So this makes me think that my tsconfig is wrong and TypesScript completely ignores this part:

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

What am I'm doing wrong when trying to specify path to the folder with my own custom type definitions?

p.s. "node_modules/@types/" is picked up by TypeScript properly (everything that is inside @types is available to me). However "./custom_types/" is ignored.

UPD: Many answers out there are suggestion to do something with baseUrl and paths. However doing this did nothing for me:

 "baseUrl": "./",
    "paths": {
      "@custom_types": ["*", "./custom_types/*"]
    },
    "typeRoots": ["@custom_types/custom.d.ts", "node_modules/@types/"],
typescript node.js javascript
2 Answers

I've done this a while ago and I remember that it was a struggle. They might of changed it in the newer versions of typescript but I haven't tested it out yet. The tsconfig that I have from a while ago looks like:

"compilerOptions": {
    "module": "commonjs",
    "noImplicitAny": true,
    "removeComments": true,
    "preserveConstEnums": true,
    "skipLibCheck": true,
    "sourceMap": true,
    "outDir": "./dist",
    "lib": [
      "es2017"
    ],
    "baseUrl": ".",
    "paths": {
      "*": [
        "*",
        "./types/*"
      ]
    }
  },
  "include": [
    "types/**/*.d.ts",
    "src/**/*"
  ],
  "exclude": [
    "node_modules",
    "**/*.spec.ts"
  ]

Take a look at the include and paths settings where I specify the location of my custom type definitions folder. This works in typescript 2.9.1.

About typeRoots: this options was added for backward compatibility support for the typings and that's why it's not even in the documentation and it's shouldn't be used if you don't use typings. More info can be found here.

user_24776420

You need to Compile your Typescript file, before you can import in a js file.

Example:

//test.ts:

const teststring:string="TestThis";
module.exports=teststring+"!";

//run tsc test.ts
//app.js
const testring = require("./test");
console.log(testring);

Or you can look here: 'typeRoots' fails to find d.ts declaration files in project

user_147234110
Related