Using SVG assets to generate PNG images in React Native

Peter P.
Peter P.
Jul 23, 2017 · 1 min read

If you’re working on a team that does both app and web development you’re likely to find that they’re using SVG rather than PNG on the web.

Unfortuntunatny Android and iOS don’t have great support for SVG, so your best bet is to convert the SVG into 1x, 2x, and 3x PNG images to handle the different densities of mobile displays.

It occured to me that it’s a bit silly to store the PNG images in Git when I could simply generate them as an artifact during the build process. So, here’s a script that will search a directory for SVGs and convert them to 1x, 2x, and 3x PNG images.

(Forgive my sh foo is not up to scratch.)

Peter P.

Written by

Peter P.

Punk stuck in the body of a Programmer. South African in Berlin.

Welcome to a place where words matter. On Medium, smart voices and original ideas take center stage - with no ads in sight. Watch
Follow all the topics you care about, and we’ll deliver the best stories for you to your homepage and inbox. Explore
Get unlimited access to the best stories on Medium — and support writers while you’re at it. Just $5/month. Upgrade