Not loading Font Awesome fonts on other routes

[Grimones]

Hi! I'm trying to migrate a website to Next.js. It happened that website uses a global index.css and also font-awesome.

I have tried with-global-stylesheet-simple
and with-global-stylesheet. The result was the same.

Currently i'm using with-global-stylesheet setup to load global css. Also, i'm using react-i18n for localizations configured by this i18next example

Global css is injected using global-styles-and-layouts proposal with <Layout /> component.

Fonts are served from custom route on server from /fonts.
The problem is that font-awesome fonts loads only on /. On other routes like /privacy they don't load. Styles are loaded propely.

index.css is under styles folder and is imported to layout and set globally. Same as in with-global-stylesheet.
To load font awesome i import it from static folder in index.css

@import url('/static/styles/font-awesome.css');

in font awesome all src for fonts were changed to /fonts

src: url('/fonts/fontawesome-webfont.eot?v=4.7.0');

Also i have tried serving fonts from static folder (by default), and importing fonts in font awesome with

src: url('/static/fonts/fontawesome-webfont.eot?v=4.7.0');

or

src: url('../fonts/fontawesome-webfont.eot?v=4.7.0');

All variants worked like a charm both on dev and prod but only on index page at /.

All packages are latest available on npm. I'm not including source code as it is almost all from examples but feel free to ask. I will be glad if anyone can help me.

[adekbadek]

Hi @Grimones,

I've created a repo based on the info in the issue, but it works fine (the FA files are loaded on root and /other page). Please PR/fork if that setup was not what you meant, or clarify here

[timneutkens]

This will be fixed by #3578 (next.js v5)