Static files not found

Hello, everyone. Got stuck with a strange error again …

[info] GET /js/app.js
[info] GET /css/app.css
[debug] ** (Phoenix.Router.NoRouteError) no route found for GET /js/app.js (Web.Router)
    (web) lib/web/router.ex:1: Web.Router.__match_route__/4
    (web) lib/phoenix/router.ex:303: Web.Router.call/2
    (web) lib/web/endpoint.ex:1: Web.Endpoint.plug_builder_call/2
    (web) lib/plug/debugger.ex:99: Web.Endpoint."call (overridable 3)"/2
    (web) lib/web/endpoint.ex:1: Web.Endpoint.call/2
    (plug) lib/plug/adapters/cowboy/handler.ex:15: Plug.Adapters.Cowboy.Handler.upgrade/4

[debug] ** (Phoenix.Router.NoRouteError) no route found for GET /css/app.css (Web.Router)
    (web) lib/web/router.ex:1: Web.Router.__match_route__/4
    (web) lib/phoenix/router.ex:303: Web.Router.call/2
    (web) lib/web/endpoint.ex:1: Web.Endpoint.plug_builder_call/2
    (web) lib/plug/debugger.ex:99: Web.Endpoint."call (overridable 3)"/2
    (web) lib/web/endpoint.ex:1: Web.Endpoint.call/2
    (plug) lib/plug/adapters/cowboy/handler.ex:15: Plug.Adapters.Cowboy.Handler.upgrade/4

endpoint.ex

defmodule Web.Endpoint do
  use Phoenix.Endpoint, otp_app: :web

  socket("/socket", Web.UserSocket)

  # Serve at "/" the static files from "priv/static" directory.
  #
  # You should set gzip to true if you are running phoenix.digest
  # when deploying your static files in production.
  plug(
    Plug.Static,
    at: "/",
    from: :web,
    gzip: false,
    only: ~w(css fonts images js favicon.ico robots.txt)
  )

  # ...

  plug(Web.Router)
end

Shouldn’t plug static match first? Why is Web.Router even called?

I also get this strange error if

== Compilation error in file lib/web/views/session_view.ex ==
** (CompileError) lib/web/views/session_view.ex:2: module Web.Router.Helpers is not loaded and could not be found
    expanding macro: Web.__using__/1
    lib/web/views/session_view.ex:2: Web.SessionView (module)
    (elixir) expanding macro: Kernel.use/2
    lib/web/views/session_view.ex:2: Web.SessionView (module)
    (elixir) lib/kernel/parallel_compiler.ex:198: anonymous fn/4 in Kernel.ParallelCompiler.spawn_workers/6

if I import Web.Router.Helpers in a module that doesn’t use Web.

So the problem is probably somewhere in the router:

defmodule Web.Router do
  use Web, :router

  pipeline :browser do
    plug(:accepts, ["html"])
    plug(:fetch_session)
    plug(:fetch_flash)
    plug(:protect_from_forgery)
    plug(:put_secure_browser_headers)
  end

  scope "/", Web do
    pipe_through(:browser)

    get("/", PageController, :index)
    get("/explore", PageController, :explore)
  end
end

or web.ex

defmodule Web do
  @moduledoc """
  The entrypoint for defining your web interface, such
  as controllers, views, channels and so on.

  This can be used in your application as:

      use Web, :controller
      use Web, :view

  The definitions below will be executed for every view,
  controller, etc, so keep them short and clean, focused
  on imports, uses and aliases.

  Do NOT define functions inside the quoted expressions
  below. Instead, define any helper function in modules
  and import those modules here.
  """

  def controller do
    quote do
      use Phoenix.Controller
      import Plug.Conn
      import Web.Router.Helpers
      import Web.Gettext
    end
  end

  def view do
    quote do
      use Phoenix.View, root: "lib/web/templates"

      # Import convenience functions from controllers
      import Phoenix.Controller, only: [get_flash: 2, view_module: 1]

      # Use all HTML functionality (forms, tags, etc)
      use Phoenix.HTML

      import Web.Router.Helpers
      import Web.ErrorHelpers
      import Web.Gettext
    end
  end

  def router do
    quote do
      use Phoenix.Router
      import Plug.Conn
      import Phoenix.Controller
    end
  end

  def channel do
    quote do
      use Phoenix.Channel
      import Web.Gettext
    end
  end

  @doc """
  When used, dispatch to the appropriate controller/view/etc.
  """
  defmacro __using__(which) when is_atom(which) do
    apply(__MODULE__, which, [])
  end
end

Indeed it should! Can you make a minimized version of the problem and put it on github so we can clone and examine it? :slight_smile:

Hrmm, that should work fine, not seeing issues in your router there either, a repro in a repo or maybe others see something I miss? :slight_smile:

Can you make a minimized version of the problem and put it on github

Sure, will do that now.

1 Like

https://github.com/idi-ot/problematic

Maybe the problem is with my webpack config? But the assets compile without problems and get stored into /priv/static …

Hmm, launching the server (via mix phx.server) throws a whole ton of:

ERROR in /home/<user>/tmp/problematic/deps/phoenix_html/priv/static/phoenix_html.js
Module build failed: Error: Couldn't find preset "es2015" relative to directory "/home/<user>/tmp/problematic/deps/phoenix_html/priv/static"
    at /home/<user>/tmp/problematic/apps/web/assets/node_modules/babel-core/lib/transformation/file/options/option-manager.js:293:19
    at Array.map (<anonymous>)
    at OptionManager.resolvePresets (/home/<user>/tmp/problematic/apps/web/assets/node_modules/babel-core/lib/transformation/file/options/option-manager.js:275:20)
    at OptionManager.mergePresets (/home/<user>/tmp/problematic/apps/web/assets/node_modules/babel-core/lib/transformation/file/options/option-manager.js:264:10)
    at OptionManager.mergeOptions (/home/<user>/tmp/problematic/apps/web/assets/node_modules/babel-core/lib/transformation/file/options/option-manager.js:249:14)
    at OptionManager.init (/home/<user>/tmp/problematic/apps/web/assets/node_modules/babel-core/lib/transformation/file/options/option-manager.js:368:12)
    at File.initOptions (/home/<user>/tmp/problematic/apps/web/assets/node_modules/babel-core/lib/transformation/file/index.js:212:65)
    at new File (/home/<user>/tmp/problematic/apps/web/assets/node_modules/babel-core/lib/transformation/file/index.js:135:24)
    at Pipeline.transform (/home/<user>/tmp/problematic/apps/web/assets/node_modules/babel-core/lib/transformation/pipeline.js:46:16)
    at transpile (/home/<user>/tmp/problematic/apps/web/assets/node_modules/babel-loader/lib/index.js:50:20)
    at Object.module.exports (/home/<user>/tmp/problematic/apps/web/assets/node_modules/babel-loader/lib/index.js:175:20)
 @ ./js/app.js 1:0-22
 @ multi ./css/app.css ./js/app.js
Child extract-text-webpack-plugin node_modules/extract-text-webpack-plugin/dist node_modules/css-loader/index.js??ref--2-2!css/app.css:
       [0] ./node_modules/css-loader?{"sourceMap":true}!./css/app.css 437 bytes {0} [built]
        + 1 hidden module
Child extract-text-webpack-plugin node_modules/extract-text-webpack-plugin/dist node_modules/css-loader/index.js??ref--2-2!node_modules/tachyons/css/tachyons.css:
       2 modules

And similar with app.js, webpack is unable to compile them. Without them existing phoenix cannot serve them. ^.^

So just need to fix your webpack compilation stuff (I’ve not used it as of yet myself).

Static assets do exist in my case.

Added contents of /priv/static to the repo.

If I touch empty app.css and app.js files then phoenix is finding them just fine here with no other issues listed.

1 Like

Testing…

You still do not have an app.css or an app.js in the files you just committed:

─➤  git pull
remote: Counting objects: 13, done.
remote: Compressing objects: 100% (9/9), done.
remote: Total 13 (delta 3), reused 13 (delta 3), pack-reused 0
Unpacking objects: 100% (13/13), done.
From https://github.com/idi-ot/problematic
   0d9ea24..15ae330  master     -> origin/master
Updating 0d9ea24..15ae330
Fast-forward
 apps/web/.gitignore                   |    2 +-
 apps/web/priv/static/css/bundle.css   |    2 +
 apps/web/priv/static/css/tachyons.css | 3355 ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
 apps/web/priv/static/favicon.ico      |  Bin 0 -> 1258 bytes
 apps/web/priv/static/js/bundle.js     |  145 ++++
 apps/web/priv/static/js/tachyons.js   |   76 ++
 apps/web/priv/static/robots.txt       |    5 +
 7 files changed, 3584 insertions(+), 1 deletion(-)
 create mode 100644 apps/web/priv/static/css/bundle.css
 create mode 100644 apps/web/priv/static/css/tachyons.css
 create mode 100644 apps/web/priv/static/favicon.ico
 create mode 100644 apps/web/priv/static/js/bundle.js
 create mode 100644 apps/web/priv/static/js/tachyons.js
 create mode 100644 apps/web/priv/static/robots.txt
1 Like

Right, the problem was in the name. bundle.css instead of app.css. I truly deserve my name. Thank you for your help!

2 Likes

It’s an easy mistake to make, naming is hard, remembering to update all the name references is even harder. ^.^;

1 Like