Using iconify offline

[aminya]

I want to use iconify offline in a Nodejs app. However, I do not want to bundle only a few limited icons like how it is shown in https://iconify.design/docs/icon-bundles/.

I want iconify to work like how it works when it is online. Is there a way to do that? Can I specify a path or install a package, so iconify imports the icons on demand from the disk instead of downloading them?

The app is a tool-bar for Atom and provides a service for others to add buttons. Previously, we bundled some icon sets with the app, and others could choose the icon they wanted to show by just choosing the name.

[cyberalien]

That's a really good question and a very interesting use case.

Problem with providing all icons is, you'll need to bundle them all with your software. Right now that's 105Mb of JSON files. You can probably reduce that by removing icon set your don't need for sure.

I think solution would be to expose icon loading function in SVG framework, replace it with a custom callback to load icons one by one.

I'll think about that, will test various possible solutions. Your use case is something I didn't even consider when designing Iconify. It is a really good use case, I think supporting Electron apps would be very useful.

[aminya]

105Mb is a lot 😄 We would only need those that we already support. these

I gave you a dev environment here if you like to experiment with this: #30 (comment)

[antfu]

@aminya I am working on an explorer for Iconify which you can pick icons them pack them into icon font.https://github.com/antfu/icones
I am also happy to make it possible to export a json or js that reload icons you need to iconify. What do you think?

[cyberalien]

See #30 (comment) for a simple icon bundling script.

It can be used to make custom icon bundles with full icon sets, so developer can use Iconify offline.

I'll add it to documentation.

[aminya]

Thank you so much!

[cyberalien]

Added bundle script to documentation: https://docs.iconify.design/sources/bundles/examples/svg-framework-full.html

Script in documentation is more advanced than what I've posted above. It includes all common use cases and is easy to configure, so all you need to do is paste it in file, install dependencies, configure and run it.

[aminya]

Awesome! Thanks!