Skip to main content

SVGs

A small service announcement about SVGs: all the necessary packages have already been installed for you. How to use them? Import in your component and then use in your code.

import TeamAwesomeLogoSvg from '../../assets/icons/team-awesome-logo.svg';

<TeamAwesomeLogoSvg />

Under the hood your SVG is turned into a React Component that is default exported.

Note that this is different from how you might have done it in a Next.js app in an NX workspace, where you would do:

import { ReactComponent as TeamAwesomeLogoSvg } from '../../assets/icons/team-awesome-logo.svg';

Again your SVG is turned into a component, only this time it's made available to you through a named export which you can give an alias.