https://github.com/jkone27/feliz-vite
feliz react template: using F# , fable vite plugin, vite and vitest, an alternative to typescript?
https://github.com/jkone27/feliz-vite
css fable feliz fsharp hmr html javascript jest nodejs react typescript vite vitest web
Last synced: 2 months ago
JSON representation
feliz react template: using F# , fable vite plugin, vite and vitest, an alternative to typescript?
- Host: GitHub
- URL: https://github.com/jkone27/feliz-vite
- Owner: jkone27
- Created: 2024-12-05T15:37:03.000Z (6 months ago)
- Default Branch: main
- Last Pushed: 2025-03-17T15:01:21.000Z (2 months ago)
- Last Synced: 2025-03-17T15:33:00.103Z (2 months ago)
- Topics: css, fable, feliz, fsharp, hmr, html, javascript, jest, nodejs, react, typescript, vite, vitest, web
- Language: F#
- Homepage:
- Size: 1.61 MB
- Stars: 8
- Watchers: 1
- Forks: 0
- Open Issues: 4
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# Feliz Vite (a happy life)
This template was created for a blog post for [fsAdvent calendar 2024](https://jkone27-3876.medium.com/feliz-navidad-fd1869b31044)
The template provides a minimal setup to get React working in Vite with HMR and some ESLint rules, it starts from the basic vite template but it was adapted to run [F#](https://dotnet.microsoft.com/en-us/languages/fsharp) via [Fable](https://fable.io/), and use [Feliz](https://zaid-ajaj.github.io/Feliz/) library for awesome React built in F# DSL.
As an alternative to the official dotnet [template for Feliz](https://zaid-ajaj.github.io/Feliz/#/Feliz/ProjectTemplate) it adopts the remarkable [Vite Fable Plugin](https://fable.io/vite-plugin-fable/).
Currently, two official plugins are available (for react):
- [@vitejs/plugin-react](https://github.com/vitejs/vite-plugin-react/blob/main/packages/plugin-react/README.md) uses [Babel](https://babeljs.io/) for Fast Refresh
- [@vitejs/plugin-react-swc](https://github.com/vitejs/vite-plugin-react-swc) uses [SWC](https://swc.rs/) for Fast Refresh
## special thanks 🦔
- [ZaidAjaj](https://github.com/Zaid-Ajaj)
- [Nojaf](https://github.com/nojaf)
- [MangelMaxime](https://github.com/MangelMaxime)
## npm
clone via git to use with `npm`, you can then install and run as usual
```
npm i
```
the first install process might take a while, please report issues if u find any, then:
```
npm run dev
```
## bun
if you want to use `bun`
```cli
bun create jkone27/feliz-vite
```
you can delete `package-lock.json` file then, to have dotnet tools installed correctly **cd** into your directory and run:
```
bun install -D --trust vite-plugin-fable
```
then
```
bun install
```
then
```
bun run dev
```