Our great sponsors
-
WorkOS
The modern identity platform for B2B SaaS. The APIs are flexible and easy-to-use, supporting authentication, user identity, and complex enterprise features like SSO and SCIM provisioning.
-
Perla
A cross-platform tool for unbundled front-end development that doesn't depend on Node or requires you to install a complex toolchain
The Fable project is a F# -> compiler where is any of Javascript, Typescript and Python at the time of writing the last two are more experimental and the main support is for Javascript future iterations of Fable will cover these languages and even more like PHP, Rust, Dart.
You can find the sources for the code we'll use in this post in this repository's directory
If you need to handle dependencies via CDN/Local Dist file then some dependencies won't work because they use node like imports import {} from 'lit/some/sub/directory.js browser imports need to start with / or ./ or even ../ so they can be valid ES module imports thankfully for this you can check out in a shameless plug one of the projects I'm working on: Perla which handles this precise case but I digress, the ideal situation would be you with npm and already figured out how to serve node dependencies to your compiled code.
Please remember that each F# file is equal to a single JS File when it's ran through fable so you can create scripts for specific pages, you don't need to import/export everything from a single entry point and you can use fable-browser to do DOM manipulation, so it is not necessary to add a whole SPA framework to enhance parts of your monolith.