Есть ли какой-то способ изменить цвет SVG файла если тот был импортирован из внешнего SVG файла? То есть <img src="[svgfile]">
не позволяет контроллировать цвет, а добавляя SVG код каждой иконки в React сильно замусорит его. Я пытаюсь понять как красиво и удобно импортировать все иконки в проект.
У меня сейчас примерно следующий код:
<buttonWrapper>
<button iconBefore={facebookIcon}>Facebook</button>
</buttonWrapper>
facebookIcon
должен быть строчный SVG элемент с своими параметрами и возможностью контроллировать цвет, так есть при наведении цвет будет меняться.
Я хочу получить что-то в этом роде:
import icon from "./icons/user.svg"
<icon fill="red" />
Пока что поиск ничего полезного не дал, многие варианты лишь портят структуру кода да и в принципе много вариантов я не нашел. Может кто подскажет что делать в такой ситуации?
Меня по сути интересует как удобно и гибко писать код что бы таких вопросов больше не возникало. Из-за большого колличества расширений в проекте уже сложная структура и усложнять ее дальше страшновато.