What is the optimal way to load strings using Typescript?

[samreid]

If we move to Typescript, is there a better way to render/load the strings than we do now? See #1047

Brainstorming some ideas:

• Use top-level await combined with dynamic import of json files?
• Make the english strings file a TS class, and have other languages override it?
• Leave it pretty much as it is?

I'm not too familiar with the string plugin, so not sure what's possible or what the constraints are. Do we ever need to be able to load more than one language at runtime?

[samreid]

Maybe we can create a TypeScript type that means: an object that can have any keys, but the values are all string.

[samreid]

I tried this pattern in Gravity and Orbits, and it works great in the sim code, but fails during builds

import gravityAndOrbitsStrings from './gravityAndOrbitsStrings.js';

type GravityAndOrbitsStrings = {
  moonMass: string,
  planetMass: string,
  satelliteMass: string,
  starMass: string,
  toScale: string,
  model: string
  gravityForce: string,
  grid: string,
  mass: string,
  measuringTape: string,
  path: string,
  velocity: string,
  moon: string,
  planet: string,
  satellite: string,
  star: string,
  clear: string,
  v: string,
  returnObjects: string,

  earthMasses: string,
  earthMass: string,
  // pattern[ '0value' ][ '1units' ]:string,
  pattern: any,
  thousandEarthMasses: string,
  billionBillionSpaceStationMasses: string,
  spaceStationMass: string,
  gravity: string,
  on: string,
  off: string,
  'gravity-and-orbits': any,
  kilometers: string
};

export default gravityAndOrbitsStrings as GravityAndOrbitsStrings;

with this error:

>> Unused string: key=earthMass, value=Earth mass
>> Unused string: key=toScale, value=To Scale
>> Unused string: key=v, value=V
Fatal error: Perennial task failed:
AssertionError [ERR_ASSERTION] [ERR_ASSERTION]: missing entry for sim title, key = GRAVITY_AND_ORBITS/gravity-and-orbits.title
  at module.exports (/Users/samreid/apache-document-root/main/chipper/js/grunt/buildRunnable.js:153:3)
  at runMicrotasks (<anonymous>:null:null)
  at processTicksAndRejections (internal/process/task_queues.js:93:5)
  at /Users/samreid/apache-document-root/main/chipper/js/grunt/Gruntfile.js:287:11
  at wrap (/Users/samreid/apache-document-root/main/chipper/js/grunt/Gruntfile.js:73:7)

It was working fine with *.js when we had strict: false, but I tried switching back to strict: false and it didn't recover (even when I cleaned), I'm not sure what's happened.

[samreid]

In phetsims/bending-light#401 I found that adding a d.ts file for the strings makes it easy to say "the strings have a string key and a string value". Though not very strict, it is a convenient way to get things working without repeating ourselves. I'll commit the same pattern for gravity and orbits.

[samreid]

We now have type declarations automatically generated for our strings, closing.