TypeScript Definition Generator

This module generates TypeScript type definitions for specified entity types. It can optionally also generate cleaned up target type definitions and functions to convert objects from the initials types to the target types (parsers). It is a continuation / update of the older hoppinger package for Drupal 8, previously unreleased on drupal.org.

How to use

The generator runs as a Drush command that needs a configuration file.

Create config.yml file with the following contents:

target_directory: definitions
entities:
  input:
    - node
    - taxonomy_term
generate_parser: true

Under entities, you can list any known Drupal entities in your project to generate definitions for. Node, Taxonomy Term, Menu Link Content, Media, User, and so on.

You can call the Drush command with:

drush tsg [PATH TO CONFIGURATION FILE]/config.yml

In your specified target_directory you will find generated defintions for TypeScript that may contain, for example, something like the following for a project with Metatag module and an "Event" content type with various fields:

... code excerpt 

export type MetatagComputedItem = {
  tag: string,
  attributes: any
}

export type PathItem = {
  alias: string | null,
  pid: number | null,
  langcode: string | null
}

export type NodeBase = {
  nid: FieldItemList<IntegerItem>,
  uuid: FieldItemList<UuidItem>,
  vid: FieldItemList<IntegerItem>,
  langcode: FieldItemList<LanguageItem>,
  type: FieldItemList<EntityReferenceNodeTypeItem>,
  revision_timestamp: FieldItemList<TimestampItem>,
  revision_uid: FieldItemList<EntityReferenceUserItem>,
  revision_log: FieldItemList<StringItem>,
  status: FieldItemList<BooleanItem>,
  uid: FieldItemList<EntityReferenceUserItem>,
  title: FieldItemList<StringItem>,
  created: FieldItemList<TimestampItem>,
  changed: FieldItemList<TimestampItem>,
  promote: FieldItemList<BooleanItem>,
  sticky: FieldItemList<BooleanItem>,
  default_langcode: FieldItemList<BooleanItem>,
  revision_translation_affected: FieldItemList<BooleanItem>,
  moderation_state: FieldItemList<StringItem>,
  metatag: FieldItemList<MetatagComputedItem>,
  path: FieldItemList<PathItem> | undefined
}

export type NodeEventDetail = NodeBase & {
  type: FieldItemList<EntityReferenceNodeTypeItemSpecific<"event_detail">>,
  field_16x9_image: FieldItemList<EntityReferenceMediaItem>,
  field_accessibility: FieldItemList<EntityReferenceTaxonomyTermItem>,
  field_audience: FieldItemList<EntityReferenceTaxonomyTermItem>,
  field_button_link: FieldItemList<LinkItem>,
  field_callout_title: FieldItemList<StringItem>,
  field_centers_alignment: FieldItemList<EntityReferenceTaxonomyTermItem>,
  field_content_category: FieldItemList<EntityReferenceTaxonomyTermItem>,
  field_date_time_info: FieldItemList<StringItem>,
  field_display_date: FieldItemList<DatetimeItem>,
  field_end_date: FieldItemList<DatetimeItem>,
  field_event_description: FieldItemList<TextItem>,
  field_event_type: FieldItemList<EntityReferenceTaxonomyTermItem>,
  field_experience_language: FieldItemList<EntityReferenceTaxonomyTermItem>,
  field_experience_style: FieldItemList<EntityReferenceTaxonomyTermItem>,
  field_header_title: FieldItemList<StringItem>,
  field_length: FieldItemList<StringItem>,
  field_museum_spaces: FieldItemList<EntityReferenceTaxonomyTermItem>,
  field_people: FieldItemList<EntityReferenceNodeItem>,
  field_personas: FieldItemList<EntityReferenceTaxonomyTermItem>,
  field_price: FieldItemList<StringItem>,
  field_series: FieldItemList<EntityReferenceTaxonomyTermItem>,
  field_start_date: FieldItemList<DatetimeItem>,
  field_subtitle: FieldItemList<StringItem>,
  field_summary: FieldItemList<StringItem>,
  field_topics: FieldItemList<EntityReferenceTaxonomyTermItem>,
  layout_builder__layout: FieldItemList<LayoutSectionItem>
}

... code excerpt

Extending

You can provide additional support for generating definitions by implementing your own generator and component. See the included typescript_generator_metatag module for how that can be done - enabling that module will also include Metatag definitions as part of the generated output.