{"repo":"oblador/react-native-vector-image","free":true,"listed":false,"github":"https://github.com/oblador/react-native-vector-image","clone":"git clone https://github.com/oblador/react-native-vector-image.git","description":"iOS/Android native vector assets generated from SVG","language":"JavaScript","stars":363,"topics":["react-native","react-native-component","svg","vector-drawable"],"license":"MIT","category":"mobile-apps","readme_excerpt":"React Native Vector Image iOS/Android native vector assets generated from SVG. - Faster render – 5x faster than react-native-svg . - Smaller JS bundle = faster startup. - Native support for dark mode. - Web support for Expo. Installation Android Edit android/app/build.gradle to look like this (without the +): iOS Open your project in Xcode, select the Build Phases tab, and edit the Bundle React Native code and images script to look like this (without the +): Expo After installing this npm package, add the config plugin to the plugins array of your app.json or app.config.js : Next, rebuild your app as described in the \"Adding custom native code\" guide. Options Shout out to zamplyy for making the first version of the Expo plugin. Usage Since native vector assets cannot be served over http via metro dev server, they must be generated and compiled into the app bundle. Step 1: import an .svg file To add dark mode to your image, create a new file with an .dark.svg extension, ie image.svg = light and image.dark.svg = dark. Step 2: generate native assets This takes a while as metro has to go through all the code to find the imported SVGs. Note: for Expo just use the plugin and npx expo prebuild . Argument Description Default ---------------------- -------------------------------------------------------------------- ----------------------------- --entry-file Path to the app entrypoint file. index.js --config Path to the metro config file. metro.config.js --reset-cache Reset metro cach","default_branch":null,"files":null,"tree":[],"storefront":"/r/oblador","claimed":false,"request_supported":{"post":"https://gitbuyer.com/r/oblador/react-native-vector-image/request-supported","requests":0},"note":"indexed from public GitHub; nothing is for sale on this page. Clone it from GitHub. Paid listings live at /search."}