How Do I Use Namespaces Effectively with TypeScript External Modules?

How do I use namespaces with TypeScript external modules?

Problem:

You have code using namespaces with TypeScript external modules, but you're encountering errors or unexpected behavior. Here's your code:

// baseTypes.ts
export namespace Living.Things {
  export class Animal {
    move() { /* ... */ }
  }
  export class Plant {
    photosynthesize() { /* ... */ }
  }
}

// dog.ts
import b = require('./baseTypes');

export namespace Living.Things {
  // Error, can't find name 'Animal', ??
  export class Dog extends Animal {
    woof() { }
  }
}

// tree.ts
// Error, can't use the same name twice, ??
import b = require('./baseTypes');
import b = require('./dogs');

namespace Living.Things {
  // Why do I have to write b.Living.Things.Plant instead of b.Plant??
  class Tree extends b.Living.Things.Plant {
  }
}

Candy Cup Analogy:

Imagine organizing candies on sheets of paper. If each sheet is a separate module, creating a cup labeled "A" on each sheet isn't helpful—it's like creating extra steps without actually organizing your candy.

Going Cupless:

Instead of using namespaces, consider writing your code like this:

// Mod1.ts
export class Twix { ... }

// Mod2.ts
export class PeanutButterCup { ... }

// Mod3.ts
export class KitKat { ... }

This creates a simpler structure without the need for unnecessarynamespaces.

Reasons Namespaces Aren't Ideal for Modules:

• Organization: Filesystem organization addresses this need.
• Name Conflicts: This issue doesn't arise within modules as objects have unique names.

Guidance for External Modules:

• Export as close to top-level as possible.
• Use export default for single exports.
• Put multiple exports at top-level.
• Use module/namespace only for large exports.

Red Flags:

• Top-level export module Foo { ... }.
• Single export class/function that isn't export default.
• Multiple files with the same export module Foo { ... }.

The above is the detailed content of How Do I Use Namespaces Effectively with TypeScript External Modules?. For more information, please follow other related articles on the PHP Chinese website!