Skip to content

Re-exporting Modules

Re-exporting allows you to consolidate exports from multiple modules into a single module. This is often done using an index.ts file, which acts as a central point for exports.

Consider this simplified file structure of the SimpleKit implementation:

src/
  ├── events/
  │   ├── events.ts
  │   ├── translators.ts
  │   └── index.ts        ←  consolidated re-export
  ├── utility/
  │   ├── hittest.ts
  │   ├── measuretext.ts
  │   ├── vector2.ts
  │   └── index.ts        ←  consolidated re-export
  ├── windowing-system/
  │   ├── coalesce.ts
  │   ├── windowing-system.ts
  │   └── index.ts        ←  consolidated re-export
  └── canvas-mode.ts      ←  SDK re-export

Index.ts Re-Export to Simplify SDK

An index.ts file consolidates exports from multiple code files in the same folder. It acts as a central point for module exports, allowing you to import everything from a single entry point. This not only shortens import paths but also improves maintainability and readability by providing a clear overview of available functionalities.

For example, the index.ts file in the utility directory consolidates exports from multiple utility files.

In utility/index.ts

typescript
// Re-exporting all utilities from the utility directory
export * from "./hittest";
export * from "./measuretext";
export * from "./vector2";
// ...

In a project's `main.ts':

typescript
import { hitTest, measureText } from './utility';

// ... code using the imported functions

Re-Export to Define a Single Import

The canvas-mode.ts file re-exports functions and types from the windowing-system and other modules, allowing them to be imported from a single entry point. This approach helps in organizing the codebase and making imports more manageable.

In canvas-mode.ts:

typescript
// Re-exporting from various modules
export * from "./events";
export {
  startSimpleKit,
  setSKDrawCallback,
  setEventListener,
  // ...
} from "./windowing-system";

In a project's `main.ts':

typescript
import { startSimpleKit, setSKDrawCallback } from './canvas-mode';

// ... code using the imported functions