How can I use typescript with `template-svelte-esm`?
Is there a way to get the template-svelte-esm HMR working with typescript? I had a go but wasn't able.
Like it builds but the URL doesn't work, can't serve the built index.js file for some reason.
I'm guessing that HMR is not possible if I'm using typescript? So I'd have to build each time?
1 Reply
As you are probably aware there aren't good public types for Foundry and this is only getting much worse with v12 and the mainlining of the mixin pattern in public APIs. That provides the main non-starter for TRL being a 3rd party framework in respect to type integration with Foundry.
While I put in a lot of time to refine the TRL types for what is delivered with TRL that doesn't make things just work with Foundry. Lots of things are accurate now, but there is still plenty of work to get all of the Svelte components fully typed and that is not going to occur until after the Svelte 5 transition.
---
The other half is that you have to change the Vite configuration.
template-svelte-esm is not configured for Typescript, so you must work out the configuration changes required for Svelte and possibly other aspects. At some future point in time probably at least a year or so from now after the Svelte 5 transition there may be a template-svelte-ts starter repo. Until then you are on your own.
Some folks are working with TS and TRL and can possibly point out what they did for changes, but it's not something I am committing to providing out of the box for now as so much changes w/ Svelte 5 and other concerns.
---
At a future point in time I might stub or provide a minimal set of Foundry types specific to the areas that directly connects the core Application API. Again this won't be addressed until after the Svelte 5 transition and any future resolution on how I might handle the evolution of a wholly unique TRL App API vs riding on top of Foundry App v1 or v2. It's not likely that the core App v2 API will ever be adopted by TRL, but any decisions on this are a year out at least.
---
The best alternative to Typescript right now is properly setting up your IDE to recognize Foundry types via JSDoc / inherent code analysis of the IDE. You can use ESM + JSDoc to write type safe code. This is getting much easier with TS 5.5 and the new @import tag for JSDoc which is going to be a lot more convenient that import types vis JSDoc. VSCode will be early to support @import, but WebStorm will not be far behind. Here is the WebStorm issue tracking this new TS / JSDoc feature.
Alas VSCode setup for this is a bit wonky, but much easier in WebStorm and pretty reliable for most aspects of Foundry dev.