Verwenden Sie benutzerdefinierte Schriftarten in Phoenix

Question

Ich versuche, eine benutzerdefinierte Schriftart in meiner Phoenix-Anwendung zu verwenden. Ich habe sie in das Verzeichnis priv/static/fonts platziert, und ordnungsgemäß erstellt und geladen die CSS-Datei in web/templates/layout/app.html.eex Vorlage, aber sie werden nicht von der Phoenix-Server bedient.

/Users/Psycho/code/elixir/my_app/ 
▾ priv/ 
    ▸ repo/ 
    ▾ static/ 
    ▸ css/ 
    ▾ fonts/ 
     ▾ walsheim/ 
      gt-walsheim-light-web.svg 
      gt-walsheim-light-web.eot 
      gt-walsheim-light-web.ttf 
      gt-walsheim-light-web.woff 

Die CSS-Datei für die Schriftart Sourcing:

// my_app/priv/css/fonts.css 

@font-face { 
    font-family: "Walsheim"; 
    font-style: normal; 
    font-weight: 300; 
    src: 
     url("/fonts/walsheim/gt-walsheim-light-web.eot?#iefix") format("embedded-opentype"), 
     url("/fonts/walsheim/gt-walsheim-light-web.woff") format("woff"), 
     url("/fonts/walsheim/gt-walsheim-light-web.ttf") format("truetype"), 
     url("/fonts/walsheim/gt-walsheim-light-web.svg#Walsheim") format("svg"); 
} 

Answer 1

Okay, fand die Lösung.

Es sieht so aus, als müssten Sie phoenix mitteilen, welche Verzeichnisse für statische Dateien dienen sollen. Ich ging zu meiner my_app/lib/my_app/endpoint.ex Datei in und aktualisiert, um die Plug.Static Stecker fonts Ordner als auch dienen:

defmodule MyApp.Endpoint do 
    use Phoenix.Endpoint, otp_app: :my_app 

    plug Plug.Static, 
    at: "/", from: :my_app, gzip: false, 
    only: ~w(css images js fonts favicon.ico robots.txt) 

    # Other Stuff ... 
end 

---

Quelle: PhoenixTalk - Serving static assets in a Sub-Folder other than the defaults