Typescript interface generator for Strapi 4 models.

npm i -D types-4-strapi

t4s

The generated types will be in the types folder.

In most cases, Strapi returns objects where all the properties (aside from id) are wrapped into an attributes object. For this reason, this is how types-4-strapi's interfaces are structured.

{
  id: number;
  attributes: {
    username: string;
    email: string;
    provider: string;
    confirmed: boolean;
    blocked: boolean;
    createdAt: Date;
    updatedAt: Date;
  }
}

However, sometimes the same object is returned "flattened". This is the case, for instance, for the /api/users endpoint, which returns an array of objects with the following structure:

{
  id: number;
  username: string;
  email: string;
  provider: string;
  confirmed: boolean;
  blocked: boolean;
  createdAt: Date;
  updatedAt: Date;
}

The same "flat" structure is also required when submitting the body of POST and PUT requests. Here is an example using fetch.

// correct
await fetch('https://project.com/api/users', {
  method: 'POST',
  body: JSON.stringify({
    username: 'Jon Snow',
    email: '[email protected]',
  }),
});

// incorrect
await fetch('https://project.com/api/users', {
  method: 'POST',
  body: JSON.stringify({
    attributes: {
      username: 'Jon Snow',
      email: '[email protected]',
    },
  }),
});

In these cases, rather than creating completely new types, we recommend that you simply 'extract' the type of the attribute object from the entity's interface using indexed access types.

type UserAttributes = User['attributes'];

await fetch('https://project.com/api/users', {
  method: 'POST',
  body: {
    username: 'Jon Snow',
    email: '[email protected]',
  } as UserAttributes
});