TypeScript configuration

🏗 Work in progress

The content of this page might not be fully up-to-date with Strapi 5 yet.

TypeScript-enabled Strapi projects have a specific project structure and handle TypeScript project configuration through tsconfig.json files.

Strapi also has dedicated TypeScript features that are configured in the config/typescript.js|ts file.

Project structure and TypeScript-specific configuration files

TypeScript-enabled Strapi applications have a specific project structure with the following dedicated folders and configuration files:

TypeScript-specific directories and files	Location	Purpose
./dist directory	application root	Adds the location for compiling the project JavaScript source code.
build directory	./dist	Contains the compiled administration panel JavaScript source code. The directory is created on the first yarn build or npm run build command
tsconfig.json file	application root	Manages TypeScript compilation for the server.
tsconfig.json file	./src/admin/	Manages TypeScript compilation for the admin panel.

Strapi-specific configuration for TypeScript

✋ 🚧 This feature is considered experimental.

These settings are considered experimental and might have issues or break some features.

Types generated by Strapi are based on the user project structure. Once the type definitions are emitted into their dedicated files, Strapi reads the type definitions to adapt the autocompletion results accordingly.

To avoid having to manually generate types every time the server restarts, an optional config/typescript.js|ts configuration file can be added, which currently accepts only one parameter:

Parameter	Description	Type	Default
autogenerate	Enable or disable automatic types generation on server restart	Boolean	false

Example:

JavaScript

./config/typescript.js

module.exports = ({ env }) => ({
  autogenerate: true,
});

TypeScript

./config/typescript.ts

export default ({ env }) => ({
  autogenerate: true,
});