Live reloading

Hi,

Live reloading is not working for me.
I am using atom with lot of packages, so there is probably conflicts with some of them.

  • atom-elixir
  • autocomplete-elixir
  • build-elixir
  • elixir-cmd
  • language-elixir
  • phoenix-elixir-snippets
  • linter-elxir-credo

I tried disabling each but it doesn’t solve the issue.

What should I try?

EDIT: I am also using 30+ other packages ( outside of elixir )

Not working…how? The log file should give a whole ton of information when reloading fails or it reloads or so? Do you have a minimal reproduceable project?

This is the repo.

I am not sure if I need to manually setup live reloading???

I tried disabling all atom packages, without success.

I also tried: GitHub - phoenixframework/phoenix_live_reload: Provides live-reload functionality for Phoenix

Have you tried different text editors?

I can’t find any configuration for live_reload and watchers in your config/dev.exs. It usually looks like

  ...
  live_reload: [
    patterns: [
      ~r{priv/static/.*(js|css|png|jpeg|jpg|gif|svg)$},
      ~r{priv/gettext/.*(po)$},
      ~r{lib/web/views/.*(ex)$},
      ~r{lib/web/templates/.*(eex)$}
    ]
  ]

and

  ...
  watchers: [
    node: [
      "node_modules/brunch/bin/brunch",
      "watch",
      "--stdin",
      cd: Path.expand("../assets", __DIR__)
    ]
  ]

and in lib/endpoint.ex you have

  if code_reloading? do
    plug Phoenix.CodeReloader
  end

instead of

  if code_reloading? do
    socket("/phoenix/live_reload/socket", Phoenix.LiveReloader.Socket)
    plug(Phoenix.LiveReloader)
    plug(Phoenix.CodeReloader)
  end

Try generating a new phoenix project with mix phx.new my_app, verify that live reload works there, and diff against nilcrud to see what exactly you are missing.

1 Like

Tried with Sublime, still not work.

Question:

Is reloader set by default when I create new phx project, or do I need to add it manually?

EDIT:

I tried generating new project. It doesn’t work.

It works for me automatically. I don’t think I had to setup anything. What OS are you on? I remember having problems with fswatch.

Was that project also generated with --no-brunch passed?

–no-brunch --no-html

I am on mac.

--no-brunch will generate a project without code reloading, as there is nothing to compile the files you want to reload and as you saw there are no watchers being set when you generate a project with that flag.

1 Like

ok. Thanks.

Is there some recommended way to implement it myself with --no-brunch project, or would it be better to use project with Brunch even though I don’t need it?

Even for a --no-brunch project @idi527’s post covers all the salients points (another example).
“Hook in” your watch/build script into config/dev.exs then whenever that script builds the assets, Phoenix LiveReloader will reload the page. And pay particular attention to the patterns under live_reload - if the built files aren’t covered by those patterns phoenix won’t reload.

2 Likes

Thanks.

Do I need to install it also somehow?

** (UndefinedFunctionError) function Phoenix.LiveReloader.init/1 is undefined (module Phoenix.LiveReloader is not available)

That’s probably because you also used the --no-html option which indicates that Phoenix doesn’t serve any assets at all.

In this context “live reloading” refers to Phoenix reloading the page whenever it detects that CSS, JS, EEx template, or Elixir view code has been updated.

Are you possibly talking about automatic recompilation when you modify some non-web Elixir sources?

1 Like

Exactly,

I thought LiveReloader is used for this.

Now I see that patterns are pointing to Views and Templates.

I need something like nodemon in node.js.

3 Likes

Thanks once again.