SVG use in React Native project

Question

I want to use SVG icons in my React Native project. I\'m requiring it like:

var svg = require(\'../images/Upvote.svg\');

But i\'m getting t

Answer 1

I use react native SVG and a small my own component for showing SVG. If the files SVG are too much I think solution with icoMoon is more complex but better. Solution here: Which is the best approach to insert an vector (svg) graph into a react native application

This is my own component that usually use when I use few SVG files in my app.

import React from 'react';
import Svg,{
Circle,
Ellipse,
G,
LinearGradient,
RadialGradient,
Line,
Path,
Polygon,
Polyline,
Rect,
Symbol,
Text,
Use,
Defs,
Stop
} from 'react-native-svg';


const CarParkSensor = (width, height) => ;

const SvgAssets = function(props){
const {icon, width = 80, height = 80} = props;

const lib = {
    'car-park-sensor': CarParkSensor
};

const Element = lib[icon];

if(!Element){
    throw new Error(`SvgAssets doesn't have any icon with name ${icon}. Please insert a valid icon`);
}

    return Element(width, height);
};
export {SvgAssets}

Then you can use it in this way