This article's content
Module resolution in TypeScript

Module Resolution

You can import modules relatively

import {Something} from './Something';
import {Something} from '/Something';
import {Something} from '../bar/Something';

or Non-relatively:

import {Something} from 'mylibrary';

How does TypeScript find modules that you are referencing? Either via Classic or Node --moduleResolution strategy. Classic is the default when emitting AMD, System or ES2015 modules. Node is the default when emitting CommonJS or UMD modules.

Resolving Classic Relative Imports:

// assuming this file is /src/app/foo.ts
import {Something} from './Something';

// will look in this order:
/src/app/person.ts
/src/app/person.d.ts

Resolving Classic Non-relative Imports:

// assuming this file is /src/app/foo.ts
import {Something} from './Something';

// will look in this order:
/src/app/person.ts
/src/app/person.d.ts
/src/person.ts
/src/person.d.ts
// continue searching up the directory tree

Resolving Node Relative resolution:

// assuming this file is /src/app/foo.ts
import {Something} from 'person';

// will look in this order:
// /src/app/person.ts
// /src/app/person.tsx
// /src/app/person.d.ts
// /src/app/person/package.json (having a 'typings' property)
// /src/app/index.ts
// /src/app/index.tsx
// /src/app/index.d.ts

Resolving Node Non-relative resolution:

// assuming this file is /src/app/foo.ts
import {Something} from 'person';

// will look in this order:
// /src/app/node_modules/person.ts
// /src/app/node_modules/person.tsx
// /src/app/node_modules/person.d.ts
// /src/app/node_modules/person/package.json (having a 'typings' property)
// /src/app/node_modules/index.ts
// /src/app/node_modules/index.tsx
// /src/app/node_modules/index.d.ts
// now going up one directory but still looking in node_modules
// /src/node_modules/person.ts
// /src/node_modules/person.tsx
// /src/node_modules/person.d.ts
// /src/node_modules/person/package.json (having a 'typings' property)
// /src/node_modules/index.ts
// /src/node_modules/index.tsx
// /src/node_modules/index.d.ts
// continue searching up the directory tree

You can define a location that the compiler will look up when importing non-relative modules:

// tsconfig.json
{
  "compilerOptions": {
    "baseUrl": "./modules"
  }
}

You can also specify specific lookup locations for specific modules:

// tsconfig.json
{
  "compilerOptions": {
    "paths": {
      "my_lib" : ["./customPath"] // relative to baseUrl if specified
    }
  }
}

If you have source files located under several locations and you want to combine them, then you can use:

// tsconfig.json
{
  "compilerOptions": {
    "rootDirs": [
      "modules",
      "src",
      "ts/modules"
    ]
  }
}

To troubleshoot module resolution:

// tsconfig.json
{
  "compilerOptions": {
    "traceResolution": true
  }
}

About Author

Mathias Bothe To my job profile

I am Mathias from Heidelberg, Germany. I am a passionate IT freelancer with 15+ years experience in programming, especially in developing web based applications for companies that range from small startups to the big players out there. I create Bosycom and initiated several software projects.