vite-elm-template VS elm-live

After that point I started looking into how Elm works from the web dev perspective with resources like Elm in Action and Frontend Masters courses (first working in ellie-app-for-elm-dev then upgrading to vite-elm-template).

Using vanilla HTML and JS is nice, but most of the time at work or in larger projects we're using some sort of build tooling to have a more streamlined experience. I'm personally a big fan of Vite, the frontend tooling solution by the creator of Vue. I maintain a Vite template for building Elm applications, which utilized the excellent Elm plugin for Vite to achieve hot module reload and directly importing our .elm files into our Javascript.

This was a template I created to scratch my own itch. As a Vue developer, I love working with Vite, and really wanted a base template for Vite that I could use to build Elm applications. vite-elm-template is a basic Vite template intended to get you started writing in Elm without having to spend time configuring everything yourself. Unlike elm-pages or elm-spa, it's not a framework of any sort. If you want to bring in single-page application features, or other functionalities, you will have to build those in yourself. That said, it's perfect for getting started with a basic environment.

However, getting it to work in elm-live, which elm-book wraps, was a bit challenging. I wanted to layout how to get this to work in case you’d like to use Tailwind or your own CSS framework.

I recently discovered you can also use `npx kill-port 8000` to kill any process hosting at that particular port. I use elm-live, but I think it works for any service.

First on our list is elm-live. From their README, elm-live provides:

Using elm-live, you’ll run elm-live and your changes + compile errors will be reflected quickly in the open browser window.