This is a tool to convert Contentful Models (Content Types) to the TS Definitions. Provides a way to automate TS Definitions generation. Could be used as a library or cli tool.
$ npm install content-type-to-typescript --save
- As CLI
$ ./node_modules/.bin/content-type-to-typescript --access-token <token> --space <space> --output <filepath>
This command will generate TS Definition file. Could also be used as a npm script.
package.json:
"scripts": {
"sync-contentful-types": "content-type-to-typescript --access-token <token> --space <space> --output <filepath>"
}Usage:
npm run sync-contentful-types
- As a library using JSON preview from Web App
Copy JSON Preview from Contentful Web App
import { compileFromContentTypes } from 'content-type-to-typescript';
const category = {
name: 'Category',
description: null,
fields: [
{
id: 'title',
name: 'Title',
type: 'Text',
required: true,
omitted: false,
},
],
}
const typings = await compileFromContentTypes([category]);
console.log(typings);compileFromContentTypes(
contentTypes: Array<Partial<ContentType>>,
options?: Partial<Options>
): Promise<string>The structure of the Content Type is described here Contentful data model.
| Property | Type | Required? | Description |
|---|---|---|---|
| bannerComment | String | A comment at the top of the response |
Input:
{
"name": "Category",
"fields": [
{
"id": "title",
"name": "Title",
"type": "Text",
"required": true,
"omitted": false
},
{
"id": "icon",
"name": "Icon",
"type": "Link",
"required": false,
"omitted": false,
"linkType": "Asset"
},
{
"id": "categoryDescription",
"name": "Description",
"type": "Text",
"required": false,
"omitted": false
},
{
"id": "simpleTextField",
"name": "Simple text field",
"type": "Symbol",
"required": false,
"validations": [],
"disabled": false,
"omitted": false
}
]
}Output:
export interface Category {
title: string;
icon?: AssetLink;
categoryDescription?: string;
simpleTextField?: string;
}
export interface AssetLink {
type: string;
linkType: string;
id: string;
}MIT License - fork, modify and use however you want.
React
Typescript
Django
Laravel
Facebook
Microsoft
Google
Alibaba
D3
Tencent