Import SVGs as React Components | How to code Tutorial
source link: https://www.youtube.com/watch?v=KOo8UuoY33I
Go to the source link to view the article. You can view the picture content, updated content and better typesetting reading experience. If the link is broken, please click the button below to view the snapshot at that time.
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/
Show lessShow more
1 Comment
Recommend
About Joyk
Aggregate valuable and interesting links.
Joyk means Joy of geeK