elt547
Trying to make my function components available everywhere, getting an error `module_info/1` is undefined?
I’m trying to get my function components available in all of my views. My shared components are in there own files under /live/components/_shared. And I have one shared.ex file available under /live/components/shared.ex. I don’t know enough about macros in elixir yet.
This is what it looks like:
defmodule HydroplaneWeb.Components.Shared do
alias HydroplaneWeb.Components.Shared
defmacro __using__(_opts) do
quote do
import Shared.{Button, Card, Dropdown, Lists, Modal}
end
end
end
But when I use it from my view_helpers() it is giving me the error Shared.Button.module_info/1 is undefined (function not available).
defp view_helpers do
quote do
# ..................
use HydroplaneWeb.Components.Shared
end
end
I have tried a few different configurations but just know I’m missing something basic. How can I get this working so that all of my function components are available in my liveview templates? Also what key concept am I misunderstand so I can avoid the same mistake in the future?
Marked As Solved
Nicd
Is def components in HydroplaneWeb using view_helpers() also? Then you’re running into a circle when compiling: view_helpers → import HydroplaneWeb.Components.Shared.Button → use :components → view_helpers.
Also Liked
benwilson512
The alias HydroplaneWeb.Components.Shared you have at the top of the file is not in the same scope as your import Shared line. You can see this in the error message in that it is Shared.Button.module_info/1 not HydroplaneWeb.Components.Shared.module_info/1.
You should either make the import fully qualified eg import HydroplaneWeb.Components.Shared.{Button, Card, Dropdown, Lists, Modal} or add the alias inside the quote. I’d recommend just making it fully qualified so you don’t inject an alias into the other module.
krstfk
Can you share your button module?
krstfk
That’s what I think as well.
josevalim
Right!
Suggestion: don’t use use HydroplaneWeb, :component. We will most likely do use Phoenix.Component itself in new Phoenix apps on each component module and favor explicit imports per module.
Also 1 module with multiple shared components is better than 10 modules with individual components. ![]()







