favicon support about apollo-universal-starter-kit HOT 11 CLOSED

One more:
Using this code hardcoded in index.jsx it works on dev correctly.
But after compile when running in prod env, it looks like it look for the favicons pngs in the wrong folder ie:

href="/./assets/6f9927a38c643c8f5fcac15a6c15aa04.png

instead of:

href="/assets/./assets/6f9927a38c643c8f5fcac15a6c15aa04.png

(it should be with assets twice i think).
It only happen for the favicons, for other images it works correctly.

(The files exists in the filesystem under build/server/assets both the favicons and the regular images)

(i remember something similar before a month when running on dev which looks like it search something in the prod url)
Any idea?

from apollo-universal-starter-kit.

Hi @GiladShoham

Yes, properly supporting favicon's would be nice I think.

from apollo-universal-starter-kit.

I continue investigating the problem with my favicon and found:

1. in the index.jsx there is check if it's dev or not, if not it will add /assets and find the correct url with the assetMap
2. most of the images like the logo is found both under build/server/assets and build/client/assets and therefor found in the assets.json.
3. the favicon is found only on build/server/assets so it's not in the assetMap. so i can't use this same technics.

I consider adding ManifestPlugin to server plugins to create another assetMap but it looks very wrong for me, and it's kind of workaround instead take care the real problem.

Is there any reason why other pngs are both in client and server and those favicon not?
Does adding assetMap for the server assets is reasonable solution?

Thanks.

from apollo-universal-starter-kit.

@GiladShoham

Is there any reason why other pngs are both in client and server and those favicon not?

I'm not sure what you are talking about, when I run 'npm run build' all the images are placed into build/client/assets

from apollo-universal-starter-kit.

@GiladShoham Ah, I understand you now. You are talking about image files that are placed into build/server, during development phase, I will look into this, whether it is still needed...

from apollo-universal-starter-kit.

@GiladShoham I think all your concerns raised in this ticket should be resolved by commit:
e87cf75

from apollo-universal-starter-kit.

@Vlasenko
Thank you.
It's still needed.
Meantime i did some workaround.
I create new loader for the favicon files, without hashing in the name.
Then i faced another problem (when put it in the head on html.jsx) it didn't sent to the client.
So i required them as well in the body in hidden div (which is really bad solution), so when reference them in the link href in the head i found them.

By the way, here is a great article about favicons and web pack.

(it didn't worked very well for me exactly like this, it did create the files in the output, but still didn't sent to the client without the workaround).
And later i decided to move it to dedicated loader in the config.

from apollo-universal-starter-kit.

@GiladShoham
Yes, I'm aware, that this can be tricky. I believe I have implemented it the proper way in the commit:
e87cf75

As in that article I use require.context as well to require all the favicon images and favicon metadata from src/assets folder as specified in the link you have posted (by the way you can put other images into this folder and subfolders inside this folder and they will appear in assetMap with hash from their contents in the name). But above that I also use hashing on favicon files as I do for all the other image assets, so long term caching is done better then described in the link you posted - e.g. when underlying icon contents change - the name will also change, because hash from file contents changes.

from apollo-universal-starter-kit.

Looks great!
I'll check it soon.
I think it will be better to copy the favicon.ico to the root as well (without hashing) because some browsers are looking for this exact file in the root by default.

from apollo-universal-starter-kit.

@GiladShoham Yes, I think you are right. I have moved all assets into root URL and added exception for favicon.ico to not have hash in its name, please see commit:
9c3ed91

from apollo-universal-starter-kit.

@Vlasenko
Thanks!
I'll merge it to my project in few days.

from apollo-universal-starter-kit.