Phoenix LiveComponent示例无法运行，报模块不可用错误

出现UndefinedFunctionError提示MyAppWeb.HeroComponent.__live__/0未定义，核心原因是组件文件未被正确编译加载：

问题根源 #

你创建的组件文件是hero.exs，Elixir中.exs是脚本文件，不会被编译到应用的字节码中，而LiveComponent作为需要被调用的模块，必须使用.ex扩展名的编译型文件。

解决步骤 #

1. 修改文件扩展名
   将lib/my_app_web/components/hero.exs重命名为lib/my_app_web/components/hero.ex

2. 重启Phoenix服务器
   文件扩展名修改后，必须重启服务器才能让编译器重新加载该模块

3. 验证模块状态
   可以在项目根目录启动iex -S mix，执行以下命令确认模块加载正常：

   MyAppWeb.HeroComponent.__info__(:functions)
   

   输出中如果包含__live__: 0，说明模块已正确编译。

4. 可选：检查编译路径
   若仍有问题，检查mix.exs中的elixirc_paths配置，确保lib/my_app_web/components在编译路径内：

   defp elixirc_paths(:test), do: ["lib", "test/support"]
   defp elixirc_paths(_), do: ["lib"]
   

   默认配置下lib目录会被全部包含，无需额外修改。

你的组件代码、LiveView中的别名引用以及模板调用都是正确的，只要解决文件扩展名问题即可恢复正常。

内容的提问来源于stack exchange，提问作者martins