Provides a bare-bones Foundry module template repo to get set up with using TyphonJS Runtime Library and Svelte on Foundry VTT with ES Modules.
Triple licensed under the CC0, MIT, or Unlicense. This repo is intended as public domain / freely available starter code that you can use for any project you choose and licensed however you see fit with no restrictions.
Getting started with a new library or development methodology can be difficult. This template repo contains a bare-bones setup suitable to start working on your own module. Certainly do check out Essential Svelte (ESM) for more involved demos that show specific concepts available with Svelte and TRL. Please stop by the Discord server to ask any questions.
- Create your version of the template in a new repo by clicking on the "template" button above. In this process rename the repo to your new module name.
- Use WebStorm or VSCode to clone your repo into the Foundry VTT data / modules directory (make sure to keep the name of your repo as the folder installed in your module directory).
- Modify the module
id
inmodule.json
to match your new Foundry package ID. - You may of course also change the title of the module in
module.json
to your new module name. - In
./vite.config.mjs
updates_PACKAGE_ID
which referencesmodules/template-svelte-esm
to your new module ID. in step #3 above. Also provide a short unique hash ID fors_SVELTE_HASH_ID
; suggestion: base it off your package ID. - Open in your IDE or via command line and proceed to run
npm install
- Run the NPM script
build
to create the production bundle ordev
to run in developer mode which usesesbuild
& HMR (hot module replacement) to dynamically update your running module in real time for all Svelte related components. - Restart Foundry VTT. This is necessary for Foundry to load the new module.
- You should now have a new module installed
Template Svelte (ESM)
or whatever title you set in step #4 visible in your modules list. - Launch a game / world of your choice.
- Enable your new module under
Manage Modules
. - On reload the basic application will appear instantly as it is rendered in the
ready
Foundry hook from the entry point: ./src/index.js
Not a lot as this is a bare-bones setup allowing you to further modify this module to your own liking. It provides
the basic build setup and a "dummy" SvelteApplication instance. The best thing to do is to change your repo name to the
ID of your new module and update id
in module.json
to match your new module ID.
The TyphonJS Runtime Library (TRL) brings an exciting new library resource for all Foundry VTT developers to build advanced modules and game systems using Svelte. A Svelte UI component library built for Foundry and extensions to the core Foundry UI / Application framework make it easy to create declarative Svelte based UIs in a method familiar to Foundry VTT developers. The core UI component framework contains reactive "application shells" that provide an enhanced ability to control your UI / window experience including intro and outro transitions along with support key UI elements like context menus and a new backward compatible and API compliant Dialog component that features a modal dialog option.
TRL is innovative as it delivers a runtime library module for Foundry that packages up the runtime in a way that can be shared across any number of modules / game systems utilizing it thereby saving a lot of space in any given module or game system. Optionally, it is possible to also bundle TRL directly into your module or game system. The TRL is both a Foundry library module and an NPM package providing the development dependency utilized for code