Taking on new clients for Elixir and web development.
Mike Zornek

LiveView Modules Must End in `Live`

Posted on

When working with LiveView you’ll notice people naming modules with the suffix Live, as seen in module names like FlickWeb.Ballots.IndexLive or FlickWeb.Vote.VoteCaptureLive.

A student I was mentoring once asked me what that Live suffix was for and if it was required.

We drafted some simple LiveView demos with modules that did not end in Live, and things worked fine. I had a gut feeling that this was required, but I could not put my finger on it.

Today, I was reminded when and why you need the Live suffix.

When using the live/4 router macro, you can optionally include an action like :new and :edit as seen in the examples below.

live "/ballot/new", Ballots.EditorLive, :new
live "/ballot/:url_slug/:secret/edit", Ballots.EditorLive, :edit

This action name will be available in the live view’s socket.assigns.live_action and can be a helpful signal when you are utilizing a live view for multiple purposes, such as a form for creation or a form for mutation, depending on the URL.

Should you use action names, your LiveView must end with Live. If it does not, you’ll see a compiler error like:

== Compilation error in file lib/flick_web/router.ex ==
** (ArgumentError) could not infer :as option because a live action was given
and the LiveView does not have a "Live" suffix. Please pass :as explicitly or
make sure your LiveView is named like "FooLive" or "FooLive.Index"
  (phoenix_live_view 0.20.17) lib/phoenix_live_view/router.ex:479: Phoenix.LiveView.Router.inferred_as/3
  (phoenix_live_view 0.20.17) lib/phoenix_live_view/router.ex:409: Phoenix.LiveView.Router.__live__/4
  lib/flick_web/router.ex:36: (module)

Looking over the related source code I kind of suspect this assumption could be removed in the future, but seems like a low impact and pain level so, meh.

I am happy to rediscover and document this. Hopefully, the explanation was helpful.


About the Author. Mike Zornek is a developer and teacher focusing on product design and development with a heavy focus on Elixir and LiveView. In between his projects, Mike helps other teams through consulting. During off hours, he enjoyed watching Phillies baseball and playing relaxing video games.