Typescript

To add Typescript support (if you started with a Javascript template) do the following:

Yarn
NPM

Terminal.app

yarn add --dev typescript @flayyer/flayyer-types @types/react

Create a file named types.d.ts to silence errors when importing assets such as import logo from "../assets/logo.png".

types.d.ts

/// <reference types="@flayyer/flayyer-types/global" />

Add this minimal tsconfig.json:

tsconfig.json

{
  "compilerOptions": {
    "strict": true,
    "jsx": "react",
    "esModuleInterop": true,
    "allowJs": true,
  },
  "exclude": ["node_modules", ".flayyer-cache", ".flayyer-dev", ".flayyer-dist", ".flayyer-processed"],
  "include": ["types.d.ts", "**/*.ts", "**/*.tsx"]
}

Now you can code your templates using Typescript:

templates/main.tsx

import React from "react";
import { TemplateProps } from "@flayyer/flayyer-types";

type Variables = {
  title: string;
};

export default function MainTemplate({ agent, variables }: TemplateProps<Variables>) {
  const title = variables.title; // string | undefined
  // ...
}

note

Remember to use the extension .tsx for Typescript files.

tip

Visit the repository @flayyer/flayyer-types for more info regarding types.