App.Router is not available when I start the server but works fine if I edit anything in it's file and live code realoding picks it up

Hello all

I have an umbrella project in which there are 3 apps 1) Handling model and DB access 2) A normal liveview application 3) An application holding a react app.

Within my configuration I have defined

config :react_app, ReactApp.Endpoint,
  http: [port: System.get_env("PORT") || 4001],
  debug_errors: true,
  code_reloader: true,
  check_origin: false,
  watchers: [
    node: [
      "node_modules/webpack/bin/webpack.js",
      "--mode",
      "development",
      "--watch-stdin",
      cd: Path.expand("../apps/react_app/assets", __DIR__)
    ]
  ]

So that the react app runs on a different port than the live view app.

defmodule ReactApp.Endpoint do
  use Phoenix.Endpoint, otp_app: :react_app

  # The session will be stored in the cookie and signed,
  # this means its content can be read but not tampered with.
  # Set: encryption_salt if you would also like to encrypt it.
  @session_options [           
    store: :cookie,            
    key: "_fi_react_app_key_",
    signing_salt: "YS+hDIqY"   
  ] 
    
  # Serve at "/" the static files from "priv/static" directory.
  #   
  # You should set gzip to true if you are running phx.digest
  # when deploying your static files in production.
  plug Plug.Static,
    at: "/",
    from: :react_app,
    gzip: false,
    only: ~w(css fonts images songs js favicon.ico robots.txt)
          
  # Code reloading can be explicitly enabled under the
  # :code_reloader configuration of your endpoint.
  if code_reloading? do
    socket "/phoenix/live_reload/socket", Phoenix.LiveReloader.Socket
    plug Phoenix.LiveReloader
    plug Phoenix.CodeReloader
  end 
      
  plug Plug.RequestId

  plug Plug.Parsers,
    parsers: [:urlencoded, :multipart, :json],
    pass: ["*/*"],
    json_decoder: Phoenix.json_library()

  plug Plug.MethodOverride
  plug Plug.Head
  plug Plug.Session, @session_options
  
  plug ReactApp.Router
end

And this is the endpoint defintion.
What I am currently dealing with is that when I run the project from the root directory using iex -S mix phx.server it’s not able to find the ReactApp.Router and I get the following error

[error] #PID<0.782.0> running ReactApp.Endpoint (connection #PID<0.781.0>, stream id 1) terminated
Server: localhost:4001 (http)
Request: GET /
** (exit) an exception was raised:
    ** (UndefinedFunctionError) function ReactApp.Router.init/1 is undefined (module ReactApp.Router is not available)
        (react_app 0.1.0) ReactApp.Router.init([])
        (react_app 0.1.0) lib/react_app/endpoint.ex:1: ReactApp.Endpoint.plug_builder_call/2
        (react_app 0.1.0) lib/plug/debugger.ex:136: ReactApp.Endpoint."call (overridable 3)"/2
        (react_app 0.1.0) lib/react_app/endpoint.ex:1: ReactApp.Endpoint.call/2
        (phoenix 1.5.13) lib/phoenix/endpoint/cowboy2_handler.ex:65: Phoenix.Endpoint.Cowboy2Handler.init/4
        (cowboy 2.9.0) /home/nikolis/git/umbrela_base/deps/cowboy/src/cowboy_handler.erl:37: :cowboy_handler.execute/2
        (cowboy 2.9.0) /home/nikolis/git/umbrela_base/deps/cowboy/src/cowboy_stream_h.erl:306: :cowboy_stream_h.execute/3
        (cowboy 2.9.0) /home/nikolis/git/umbrela_base/deps/cowboy/src/cowboy_stream_h.erl:295: :cowboy_stream_h.request_process/3
        (stdlib 3.8.2.4) proc_lib.erl:249: :proc_lib.init_p_do_apply/3

The wierd part is that if I modify anything in the ReactApp.Router module then the livecode realoding picks the change up and the whole thing runs smoothly.

I now this is kind of an abomination setup but still this is for expirementation and I can’t wrap my head around it !

Anybody can provide any directions on why this wierd but rather consistent behaviour occurs ?