Import SVGs as React Components | How to code Tutorial
6.8 هزار بار بازدید -
3 سال پیش
-
Hi everyone, welcome to Dev
Hi everyone, welcome to Dev Done.
⭐️ Topic ⭐️
importing SVGs as react components using create react app.
⭐️ The Why? ⭐️
Svgs today are an integral part of web development giving abilities scale images without losing the quality.
Importing SVG files as img tags have a few limitations.
⭐️ The Advantages? ⭐️
✔️ Size reduction: The conversion to ReactComponent is smaller than the SVG itself.
✔️ Since it's a component, therefore, easy to use and handle and rendered inline therefore we can control it easily.
✔️ SVG images bundled with JS, therefore no extra fetch browser calls, not even SVG Sprites needed.
✔️ Converting SVG to a component can be helpful in customizing the images.
⭐️ Resources ⭐️
Create React App - https://reactjs.org/docs/create-a-new...
SVGR library - https://react-svgr.com/playground/
⭐️ Topic ⭐️
importing SVGs as react components using create react app.
⭐️ The Why? ⭐️
Svgs today are an integral part of web development giving abilities scale images without losing the quality.
Importing SVG files as img tags have a few limitations.
⭐️ The Advantages? ⭐️
✔️ Size reduction: The conversion to ReactComponent is smaller than the SVG itself.
✔️ Since it's a component, therefore, easy to use and handle and rendered inline therefore we can control it easily.
✔️ SVG images bundled with JS, therefore no extra fetch browser calls, not even SVG Sprites needed.
✔️ Converting SVG to a component can be helpful in customizing the images.
⭐️ Resources ⭐️
Create React App - https://reactjs.org/docs/create-a-new...
SVGR library - https://react-svgr.com/playground/
3 سال پیش
در تاریخ 1400/06/06 منتشر شده
است.
6,866
بـار بازدید شده