modules/type-generation

12 notes, read out of this brain and free to use. Each one was extracted from a source and is re-checked against its exam.

expo-type-information package for generating TypeScript interfaces

The expo-type-information package automates TypeScript interface generation for Expo Modules by extracting type definitions directly from Swift code. This eliminates the need to write module interfaces multiple times in Swift, Kotlin, and TypeScript.

expo-type-information requires macOS and sourcekitten

The expo-type-information package only works on macOS. To use it, you must also have sourcekitten installed, which can be installed via Homebrew with: brew install sourcekitten.

Installation of expo-type-information package

Install expo-type-information using npm (npm install expo-type-information), yarn (yarn add expo-type-information), pnpm (pnpm add expo-type-information), or bun (bun add expo-type-information).

Generate TypeScript interface for inline modules

To generate TypeScript interfaces for inline modules, run the command: npx expo-type-information inline-modules-interface --app-json ./app.json with optional --watcher flag. The --app-json (short -a) parameter specifies the path to the app configuration file where watchedDirectories for inline modules are defined. The --watcher (short -w) flag watches the app configuration file and all watchedDirectories and regenerates the TS interface when changes occur.

Generated files for inline modules

For each inline module in a project, two files are created: a .generated.ts file containing auto-generated type definitions (do not edit this), and a .tsx file serving as the stable interface. The .generated.ts file is automatically regenerated by the CLI tool. The .tsx file can be customized; the CLI uses a file hash to detect manual changes and will stop overwriting it if customized, allowing you to add custom logic or helper functions while keeping native types synced in the generated file.

Generated files for regular Expo modules

For regular Expo modules, the expo-type-information CLI generates three files: module.types.ts (contains type definitions like enums), ModuleModule.ts (contains the native module class declaration and exports the module instance), and index.ts (reexports types and the module). These files are automatically generated from Swift source code.

Generate TypeScript interface for Expo modules

To generate TypeScript interfaces for a regular Expo module, run the command: npx expo-type-information module-interface --module ./path-to-module with optional --watcher (short -w) flag. The --module (short -m) parameter is the path to the root folder of the module. The generated files appear in the module's src directory.

Unresolved types in generated interfaces

When the expo-type-information tool cannot resolve a type (because it is not a basic type or is not defined in the provided files), that type is set to unknown. This may happen when a type is not a basic type and is not defined in the Swift file being processed, or if the tool failed to parse its definition.

Limitations of current expo-type-information implementation

The expo-type-information tool does not yet generate event type definitions from module events. Events defined in Swift modules are recognized but type definitions for them are not included in the generated TypeScript files.

File hash detection in stable interface files

Stable interface files (.tsx files for inline modules and generated module files) contain a file hash comment at the top. The CLI uses this hash to detect manual changes. If you customize the stable file, the CLI will stop overwriting it, allowing you to add custom logic while keeping generated files synced.

Example: Generated inline module interface with function

When a Swift inline module defines both constants and functions, the generated TypeScript interface includes both. Example Swift: Constant("Hello") and Function("ConcatStrings") { (str1: String, strings: [String]) -> String in ... }. The generated .generated.ts file will contain: readonly Hello: string; and ConcatStrings(str1: string, strings: string[]): string;

Example: Importing and using generated inline module types

After generation, import types from the stable .tsx file instead of using requireNativeModule directly. Example: import { Hello, ConcatStrings } from './FirstInlineModule'; instead of const FirstInlineModule = requireNativeModule('FirstInlineModule');. The stable file provides type-safe reexports and wrapper functions.

Give your agent this brain