Как вывести svg?

Question

[IIITRIX]

Использую этот компонент
https://github.com/Ahrengot/react-svg-use
Вставил в файл icon.svg

<svg xmlns="http://www.w3.org/2000/svg" style="display:none;">
  <symbol id="car">
       <path d="M29.999619,441 C25.0297143,441 21,445.029714 21,449.999619 C21,454.969524 25.0297143,459 29.999619,459 C34.9695238,459 39,454.969524 39,449.999619 C39,445.029714 34.9695238,441 29.999619,441 Z M31.8731429,454.94819 C31.4099048,455.131048 31.0411429,455.269714 30.7645714,455.365714 C30.4887619,455.461714 30.168,455.509714 29.8030476,455.509714 C29.2422857,455.509714 28.8057143,455.372571 28.4948571,455.099048 C28.184,454.825524 28.0293333,454.478857 28.0293333,454.057524 C28.0293333,453.893714 28.0407619,453.726095 28.063619,453.555429 C28.0872381,453.384762 28.1245714,453.192762 28.175619,452.977143 L28.7554286,450.929143 C28.8064762,450.732571 28.8506667,450.545905 28.8857143,450.37219 C28.9207619,450.196952 28.9375238,450.03619 28.9375238,449.889905 C28.9375238,449.629333 28.8834286,449.446476 28.776,449.343619 C28.6670476,449.240762 28.4620952,449.190476 28.1565714,449.190476 C28.0072381,449.190476 27.8533333,449.212571 27.695619,449.259048 C27.5394286,449.307048 27.4038095,449.350476 27.2925714,449.393143 L27.4457143,448.762286 C27.8251429,448.607619 28.1885714,448.475048 28.5352381,448.365333 C28.8819048,448.254095 29.2095238,448.199238 29.5180952,448.199238 C30.0750476,448.199238 30.5047619,448.334857 30.8072381,448.603048 C31.1081905,448.872 31.2598095,449.221714 31.2598095,449.651429 C31.2598095,449.740571 31.2491429,449.897524 31.2285714,450.121524 C31.208,450.346286 31.1691429,450.551238 31.1127619,450.739429 L30.536,452.781333 C30.4887619,452.945143 30.4468571,453.132571 30.4087619,453.342095 C30.3714286,453.551619 30.3531429,453.711619 30.3531429,453.819048 C30.3531429,454.090286 30.4133333,454.275429 30.5352381,454.373714 C30.655619,454.472 30.8666667,454.521524 31.1653333,454.521524 C31.3062857,454.521524 31.464,454.496381 31.6422857,454.447619 C31.8190476,454.398857 31.9470476,454.355429 32.0278095,454.318095 L31.8731429,454.94819 Z M31.7710476,446.66019 C31.5020952,446.910095 31.1782857,447.035048 30.799619,447.035048 C30.4217143,447.035048 30.095619,446.910095 29.824381,446.66019 C29.5546667,446.410286 29.4182857,446.106286 29.4182857,445.751238 C29.4182857,445.396952 29.5554286,445.09219 29.824381,444.84 C30.095619,444.587048 30.4217143,444.461333 30.799619,444.461333 C31.1782857,444.461333 31.5028571,444.587048 31.7710476,444.84 C32.04,445.09219 32.1748571,445.396952 32.1748571,445.751238 C32.1748571,446.107048 32.04,446.410286 31.7710476,446.66019 Z" />
  </symbol>
</svg>

импортировал его
и вставил в компонент
<Icon id='car' color='#D71421' />
Выводится так
<svg><use xlink:href="#car"></use></svg>

Но иконки нет

Comments

[Роман Александрович]

положите svg в папку public, затем в нужном месте <img src={"путь к svg"}/>

[IIITRIX]

Роман Александрович, Нет спасибо, так не устраивает!

[Роман Александрович]

IIITRIX, https://stackoverflow.com/questions/42296499/how-t...
https://github.com/facebook/create-react-app/issue...

[IIITRIX]

Роман Александрович, Спасибо, но это хорошо когда нужно подключить 1-2-3 иконки, но у меня их сотни, и каждую импортировать так
import Logo1 from './logo1.svg';
import Logo2 from './logo2.svg';
import Logo3 from './logo3.svg';
это будет не хорошо
Думал все в одном файле подключить и вызывать 1 файл