Skip to main content

Typescript

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

Terminal.app
yarn add --dev typescript @flyyer/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="@flyyer/types/global" />

Add this minimal tsconfig.json:

tsconfig.json
{  "compilerOptions": {    "strict": true,    "jsx": "react",    "esModuleInterop": true,    "allowJs": true,  },  "exclude": ["node_modules", ".flyyer-cache", ".flyyer-dev", ".flyyer-dist", ".flyyer-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 "@flyyer/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 @flyyer/types for more info regarding types.