Как использовать изображения SVG на реагировать родной?

Question

Я пытаюсь использовать изображения svg в своем родном приложении реакции, я занимаюсь разработкой Android.

Так что я следовал этому уроку =>

https://medium.com/faun/add-custom-svg-icons-to-your-expo-app-279b492f6a15

У меня ошибка Не удается прочитать свойство 'fill' из неопределенного, пока мне удается отобразить изображение, поэтому я пытаюсь понизить версию response-native-svg, и изображение отображается но как только я интегрировал реагирующую навигацию, мое приложение запускалось на cra sh при запуске.

Поэтому я долго искал причину этого cra sh.

I попытался удалить библиотекуact-native-svg, файл metroconfig. js и expo снова заработал, не знаю, было ли это причиной проблемы.

Я хотел бы знать, люди сталкивались с этими проблемами или, если нет, каков наилучший метод, который работает с текущей версией RN для импорта изображения SVG в собственное приложение реагировать?

Заранее спасибо за вашу помощь и ваши ответы.

РЕДАКТИРОВАТЬ

Я тестировал реактив-native-svg и реактив-native-transformer-svg с последней версией реагировать native / expo / sdk expo

С момента создания файла metro.config. js и связывания с ним с expo при обновлении файла приложения. json мое приложение expo аварийно завершает работу при запуске.

Я должен был использовать реактив-native-svg без реагирования-native-transformer-svg, то есть преобразовать SVG-файл в реагирующий SVG-файл.

Если у кого-то есть работающее решение для автоматического импорта SVG-файлов, это очень помогло бы мне.

Answer 1

Я получаю следующую ошибку, когда я делаю то, что вы сделали

Answer 2

Я использую значки SVG, конвертируя их в реагирующие функции на этом сайте. https://react-svgr.com/playground/?native=true вы также можете попробовать это, если это было полезно для вас.

Answer 3

Install react-native-svg-transformer

npm i react-native-svg-transformer --save

Я использую SVG, как показано ниже, и он отлично работает

import LOGOSVG from "assets/svg/logo.svg"
in render

<View>
  <LOGOSVG 
    width="100%"
    height="70%"
  />
</View>