Fonts linked are linked to wrong path in production

[Booli]

Description

Links to fonts imported from CSS have wrong link in production CSS file.

Expected behavior

Imported fonts in CSS load correctly in production and are loaded from static/media
Tell us what you think should happen.

Actual behavior

Font files from CSS are linked to ./static/css/static/media and therefore 404.
line in generated main.css
@font-face{font-family:Mana;src:url(./static/media/mana.9e4b11ee.eot);

http://localhost:8080/static/css/static/media/mana.b561ddbf.woff Failed to load resource: the server responded with a status of 404 (Not Found) http://localhost:8080/static/css/static/media/mana.059227ff.ttf Failed to load resource: the server responded with a status of 404 (Not Found)

Environment

react-scripts@0.8.5
v7.5.0
4.1.2

macOS El Capitan
Any Browser

Link to repo with error:
https://github.com/Booli/simmer

package.json

  "name": "simmer",
  "version": "0.1.0",
  "private": true,
  "devDependencies": {
    "react-scripts": "0.8.5",
    "sw-precache": "^4.3.0"
  },
  "dependencies": {
    "mana-font": "^1.2.0",
    "react": "^15.4.2",
    "react-dom": "^15.4.2",
    "rebass": "^0.4.0-beta.9",
    "reflexbox": "^2.2.3"
  },
  "scripts": {
    "start": "react-scripts start",
    "build": "react-scripts build",
    "test": "react-scripts test --env=jsdom",
    "eject": "react-scripts eject"
  },
  "homepage": "./"
}

Or I am misunderstanding how to import the fonts

[gaearon]

Thanks for filing, this is a known issue.
"homepage": "./" is a hack and not officially supported.

Please track #1094 for updates.

[aaronplanell]

Hi Booli,

As @gaearon said, there is a bug and the solution:

"homepage": "./"

It's not officially supported.

In my case (check #1487) I solved it transforming the absolute route to a relative route of the index file:

"homepage": "."

I repeate, this is a hack and it's not supported by CRA, but maybe it will solve your problem temporally.

I tryed check it with your project but you have the route public/Images defined in the .gitignore file and I have a lot of 404 errors because the files doesn't exists 😞

Best regards.

[gaearon]

Perhaps this will be solved by #1489.

[Timer]

Hi @Booli, now that #1489 has landed can you please test it and let us know if you're still having the problem?

[Timer]

Hi there! react-scripts v0.9.0 was just released which adds support for building for relative paths. You may read how to do so here.

Please test it and don't hesitate to reach out if this doesn't solve your specific use case!