Using namespace spread over multiple module files in TypeScript

Seems there is no way to do this using namespaces on their own (unless you want to use Module Augmentation and declare every new item to add separately); however, a namespace can be part of a class, which can be extended! This is the best alternative I can find:

CoreLibraryTypes.ts

abstract class Types { }
namespace Types { 
    export class TypeA { }
    export class TypeB { }
    export class TypeC { }
}
export { Types };

CoreTypesExtended.ts

import CoreLibraryTypes from "./CoreLibraryTypes";

abstract class Types extends CoreLibraryTypes { }
namespace Types { 
    export class TypeD { }
    export class TypeE { }
    export class TypeF { }
}
export { Types };

The downside, of course, is that only the import of the second module will have the new types added. The first module will remain as before. Ideally it would be nice to "update" a namespace of types with additional types (like from plugins), such that module augmentation was more naturally supported (instead of having to write it by hand), but I guess that will have to do until someone realizes augmentation of modules by manually declaring updated definitions is just a half-a$$ way to do what namespaces already do lol (including classes, as seen above, which can already use namespace merging as part of the class). ;)

Note: In the example above I used export { Types }; for a reason - this will allow others to augment my modules. Augmentation is not supported for default exports (unless that is desired - sort of seals it virtually).


If you have your own library and you want to export the multiple files like from namespace, you can do this:

// classes/animals/mammals.ts
export enum Mammals {
  cow = 'cow',
  goat = 'goat',
}

// classes/animals/reptiles.ts
export interface Reptile {
  isOurOverlord: boolean;
}
export function isOurOverlord(specimen: Reptile) { ... } 

// classes/animals/index.ts
import * as mammals from './mammals';
import * as reptiles from './reptiles';
export { mammals, reptiles };

// classes/index.ts
import * as animals from './animals';
export { animals };

// app.ts
import { animals } from './classes';
const reptile: animals.reptiles.Reptile = {
  isOurOverlord: animals.reptiles.isOurOverlord(...),
}

edit: i.e. you don't need typescript's namespaces in order to use that super convenient syntax of animals.reptiles.Reptile for types and values animals.mammals.Mammals within the same "namespace".


Found a way to achieve your goal but not with the namespace keyword.

  1. The "Animals" classes, Animal.ts & Mammal.ts & Reptile.ts under namespace.
  2. with index.ts for the barrel.
  3. animals.ts for namespace grouping.

Animal namespace

Sample Classes:

Classes

index.ts (as barrel)

enter image description here

animals.ts (for namespace grouping)

enter image description here

And here you go of the concept of the namespace.

enter image description here


Use re-exporting to create an external module that groups and exposes types from other modules:

// Classes/Animals.ts
export * from '.\Animals\Mammals';
export * from '.\Animals\Reptiles';

Then import the types from the new module as usual:

// app.ts
import * as Animals from '.\Classes\Animals'

let dog: Animals.Dog;
let snake: Animals.Snake;

Or

// app.ts
import { Dog, Snake } from '.\Classes\Animals'

let dog: Dog;
let snake: Snake;