strapi-content-type-to-ts

A script to generate TypeScript types (intended to be used for API calls) from Strapi content types schemas.

Usage

In your strapi project.

Add the dependency

npm i -D @smile/strapi-content-type-to-ts

Add a script in your package.json

...
"scripts": {
  ...
  "generate-content-types": "strapi-content-type-to-ts --out ./strapi-content-types.ts"
}
...

The strapi-content-type-to-ts script has several possible configurations:

| Configuration | Description | Default value | |---------------------------------------------------|-----------------------------------------------------------------------|-------------------------| | --out <file> | Output file in which TypeScript types will be written | stdout | | --strapi-root-directory <path> | Path to Strapi root directory | . (current directory) | | --custom-fields-extension-directory <directory> | Path to the directory containing custom fields extensions (see below) | custom-field |

Run the script

Run npm run generate-content-types and check the generated file: strapi-content-types.ts.

Handling custom fields

If your Strapi has custom fields (via plugins), it won't be handled natively by this script. It'll default to an any type with a FIXME in the generated types to remember you that you should handle it with a plugin. Also, executing the script will log errors of the form:

Missing custom field plugin for [customField].
Create a [pathToTheCustomFieldPlugin] file with the following signature:
module.exports = function (options) {
  return '...';
}

Here are some examples

ckeditor5.CKEditor plugin

File custom-field/ckeditor5.CKEditor.js:

module.exports = function (options) {
  return 'string';
}

multi-select.multi-select plugin

File custom-field/multi-select.multi-select.js:

/**
 * If options param is of the form ["label1","label2:value2","label3"] the code returns: (`label1` | `value2` | `label3`)[]
 */
module.exports = function (options) {
  return `(${options.map(v => {
    const [label, value] = v.split(':');
    return `\`${value || label}\``;
  }).join(' | ')})[]`;
}