Live Components suddenly not compiling, app crashing with UndefinedFunctionError

Are you perhaps still using use Phoenix.LiveView when you should now be using use Phoenix.LiveComponent?

I’m using

use MyAppWeb, :live_component

I fixed my own issue by making non-changes
e.g. {:ok, socket} to:

{:ok,
  socket
}

doing that one-by-one for all my components, and Elixir then recompiled the files and now there are no errors. Even if I revert the changes back to {:ok, socket} it still works. Very strange…

@APB9785 sounds like something in your _build directory got weird. While I generally find that compiler issues with Elixir are rare, when they do happen, they are generally fixed for me by doing rm -rf _build

Did you by any chance compiled the code or ran the app with different versions of Elixir:

• like be trying out the app inside a docker container with the entire project mapped as a volume?
• or by using your software version manager tool, like asdf to run the app with different Elixir version?

If you have done this then the _build folder get’s itself in a weird state. Also when trying out new versions of Elixir you may end-up with incompatible versions in your mix.lock and deps folder.

Thanks for the info! But in this case, I didn’t do anything with docker or asdf. I was just moving around some handle_event/3 clauses after separating a settings menu into its own LC.

So it seems that your solution is to do what is suggested here

If you could replicate the issue in a sample Phoenix repo then you could open a bug report for the Elixir compiler.

I just came across this same error message and I don’t think I touched the code between working and not-working states. Walked away from the computer with no compile errors, came back and refreshed a webpage on localhost and it gave the same error as OP. I commented out a couple uncommitted changes (a route and the live_view file for that route) to remove all unstaged edits to get back to the commit that I’m sure was working, and the error persisted.

** (exit) an exception was raised:
    ** (UndefinedFunctionError) function MyAppWeb.CheckoutLive.Show.__live__/0 is undefined (module MyAppWeb.CheckoutLive.Show is not available)
        MyAppWeb.CheckoutLive.Show.__live__()
        (phoenix_live_view 0.17.5) lib/phoenix_live_view/static.ex:239: Phoenix.LiveView.Static.load_live!/2
        (phoenix_live_view 0.17.5) lib/phoenix_live_view/static.ex:83: Phoenix.LiveView.Static.render/3
        (phoenix_live_view 0.17.5) lib/phoenix_live_view/controller.ex:38: Phoenix.LiveView.Controller.live_render/3
        (phoenix 1.6.5) lib/phoenix/router.ex:355: Phoenix.Router.__call__/2
        (my_app_web 0.1.0) lib/my_app_web/endpoint.ex:1: MyAppWeb.Endpoint.plug_builder_call/2
        (my_app_web 0.1.0) lib/plug/debugger.ex:136: MyAppWeb.Endpoint."call (overridable 3)"/2
        (my_app_web 0.1.0) lib/my_app_web/endpoint.ex:1: MyAppWeb.Endpoint.call/2

Nuked the _build to get back to working before wondering if this was an error with a resolution. Are there useful commands/spelunking to do when a _build folder gets into a confused state?

I had exactly the same problem after some formatting changes at the live_component call. Deleting _build did not solve it. After deleting node_modules/.cache the error was gone. I also noticed some minor CSS issues also solved after deleting.

Deleting _build worked for me after copying an existing live module to a new file name.