Skip to content
Kai Moschcau edited this page Feb 3, 2023 · 9 revisions

How do I make the Foundry VTT Types recognize the data layout I have defined in my template.json file?

Take a look at Actors and Items which includes detailed instructions regarding that.

I'm using a custom document class, how do I make the Foundry VTT Types recognize that?

Take a look at Custom Document Class Configuration which includes detailed instructions regarding that.

Why can't I access any properties on game / canvas?

Foundry VTT initializes these global variables right before the 'init' hook event. However, it is possible for modules / systems to access these variables in code that runs before the 'init' hook event (code that runs on the module / script level), so we need to include their uninitialized states in their types. To mitigate this, there are a couple solutions:

  1. Add a type guard when trying to access these variables:
    if(game instanceof Game) {
      // whatever you wanted to do with `game`
    } else {
      throw new Error('game not initialized yet!');
    }
  2. It is cumbersome to do this at every place where you want to access these variables. A solution for that is to create a wrapper around the variable you want to access, do the type guarding in there, and then just use the wrapper in the rest of your code instead of using the variable directly:
    function getGame(): Game {
      if(!(game instanceof Game)) {
        throw new Error('game is not initialized yet!');
      }
      return game;
    }
    
    // somewhere else in your code:
    getGame().i18n.localize('...'); // or whatever else you wanted to do with game
  3. If this is still to cumbersome to you, there is another way out: We added a way to configure a couple of global vaiables to be typed as their initialized states with the help of declaration merging (see A Quick Guide to Declaration Merging for a short introduction on what that is and on how you can use it to work around possible mistakes in the type definitions). All you need to do is globally declare the interface LenientGlobalVariableTypes with properties called like the variables that you want to be typed more leniently (the types of the properties don't matter). Currently, the variables game, socket, ui and canvas are supported. Here is an example that shows how to do this for game:
    declare global {
      interface LenientGlobalVariableTypes {
        game: never; // the type doesn't matter
      }
    }
    
    game.i18n.localize('...'); // or whatever else you want to do with game, works fine now! :)
  4. You can automatically get the solution from 3. for all global variable types by using the separate entry file @league-of-foundry-developers/foundry-vtt-types/index-lenient instead of @league-of-foundry-developers/foundry-vtt-types in your tsconfig.json:
    "types": ["@league-of-foundry-developers/foundry-vtt-types/index-lenient"]
    If you don't care that much about safety, this is probably the most convenient solution

⚠️ If you use this solution 3 or 4, be aware that the compiler won't help you if you try to access these variables before they are actually initialized, so you have to make sure yourself that this doesn't happen!

How do I create my own FormApplication?

Take a look at Creating custom FormApplications.

I am using npm 6 or yarn and getting compile errors related to @pixi/smooth-graphics

This is most likely related to some peer dependencies missing, as peer dependencies are not installed automatically by yarn and npm 6 (npm >= 7 does install them automatically). To solve the problem, simply add the missing dependencies to your devDependencies:

"@pixi/constants": "6.2.1",
"@pixi/core": "6.2.1",
"@pixi/display": "6.2.1",
"@pixi/graphics": "6.2.1",
"@pixi/math": "6.2.1",
"@pixi/runner": "6.2.1",
"@pixi/settings": "6.2.1",
"@pixi/utils": "6.2.1",