icon icon indicating copy to clipboard operation
icon copied to clipboard

Example with Custom Icons Working with ssr:false

Open JohnCampionJr opened this issue 1 year ago • 5 comments

I'm trying to use custom iconify collections, as mentioned in #311 and I can get it to work under normal conditions.

But when generating with ssr:false the icons don't appear.

I was hoping someone might have an example of how to get this working?

Similar to #311, I can't do the svg custom collection provided as there are an enormous number of svg files.

JohnCampionJr avatar Dec 14 '24 01:12 JohnCampionJr

That's the tricky part I mentioned in #311. If you don't use ssr but have an API server, you can set provider: 'server' so the icons would be requested from the server. Otherwise, there is honestly no way to serve custom icons (because Iconify doesn't have your custom icons) other than bundle them all into the client.

antfu avatar Dec 16 '24 06:12 antfu

I understand the server part; I'm just trying to get the client bundle working with the custom icons and I seem to have no luck.

JohnCampionJr avatar Dec 16 '24 13:12 JohnCampionJr

The approach of #311 won't to not to treat custom icons specially from Iconify icons, meaning that if you want to get them into the client bundle, you either need to scan the static usages or manually include icons you wanted

antfu avatar Dec 16 '24 14:12 antfu

I tried the scan: true in the clientBundle options. Is it possible its ignoring the new additionalCollections option?

I'll try to put together a repo to see if there is a bug here or something.

JohnCampionJr avatar Dec 16 '24 16:12 JohnCampionJr

https://github.com/JohnCampionJr/nuxt-icon-custom

In case it will help anyone else, I've put together a sample that seems to work as expected.

Can you check real quick and see if there is any optimizations to make?

JohnCampionJr avatar Dec 20 '24 01:12 JohnCampionJr