Material-design-icons: Separate packages for web and SVG icons

Created on 20 Oct 2014  路  12Comments  路  Source: google/material-design-icons

The current npm package weigh in at 44 MB. This takes forever to install and takes a lot of diskspace.

Would be nice if there were multiple packages so you could choose a subset of what you want:

  • material-design-icons-web - only the web 1x/2x icons
  • material-design-icons-svg - only the SVG icons

Might make sense to make material-design-icons just a combination of the above (read; exclude Android/iOS icons from the package) as I don't see why you would want to use npm when creating Android/iOS apps.

FAQ enhancement

Most helpful comment

Just to keep this thread up-to-date...

A year and a half has passed now and it seems this problem is getting a bit out of hand - In our project the material-design-icons folder is now ~340mb ;) (30x bigger than our next biggest dependency)

Luckily it's pretty easy just to take the font/svgs and keep them up to date ourselves. There is also https://github.com/jossef/material-design-icons-iconfont for those looking.

It would be preferable to have this repo publish multiple packages to npm though as an "official mirror" rather than having to rely on a fork or manually copying files.

340.7 MiB [##########] /material-design-icons

All 12 comments

+1

I'm assuming compressing the images will lighten the download.

I don't see why you would want to use npm when creating Android/iOS apps.

Using Cordova/Phonegap & family for HTML5-based apps is a thing. It is what I & 1/3 of app devs plan to do.

Suggestions:
It would be more clear to call PNGs -png & not -web. SVG browser support is ~90%. (Plus IMHO SVGs, single-file or complied into a sprite sheet, are superior for 'web' than PNGs & icon fonts.
I think it wold be rare to need all resolutions of PNGs & SVGs, so would be better to further break down the file groups? eg:

  • material-design-icons-png-ios-24dp
  • material-design-icons-png-web-xxxhdpi
  • material-design-icons-svg-48px

It's not just file size that is a problem, there are 72 380 files within the component folder. It would be very useful to be able to only get production SVG for instance.

+1

+1

+1 please

I've forked this repo and edited bower.json to include only .svg

https://github.com/FezVrasta/material-design-icons-svg

till Google decides to fix this issue feel free to use this one.

@jestelle In the new year let's look at how we can break the repo up into smaller pieces that are easier to consume specific formats from. If we can do this in a way that works really well with your scripts too, that would be a win.

let's look at how we can break the repo up into smaller pieces

That's a good idea. Perhaps put all 'material design' into an GitHub Organization? Might make it easier for cross-discovery.

any news?

Just to keep this thread up-to-date...

A year and a half has passed now and it seems this problem is getting a bit out of hand - In our project the material-design-icons folder is now ~340mb ;) (30x bigger than our next biggest dependency)

Luckily it's pretty easy just to take the font/svgs and keep them up to date ourselves. There is also https://github.com/jossef/material-design-icons-iconfont for those looking.

It would be preferable to have this repo publish multiple packages to npm though as an "official mirror" rather than having to rely on a fork or manually copying files.

340.7 MiB [##########] /material-design-icons

Any update on this?

Over a year has passed, but this is still an issue.
Any news about this?

Was this page helpful?
0 / 5 - 0 ratings

Related issues

quyleanh picture quyleanh  路  4Comments

lorenzos picture lorenzos  路  3Comments

akxer picture akxer  路  3Comments

coogle picture coogle  路  4Comments

anlexN picture anlexN  路  3Comments