I'm quite new to React and am trying to use IBM Carbon's Design system for some simple components, but I keep on getting the following console errors:
Failed to decode downloaded font: <URL>
OTS parsing error: invalid sfntVersion: 1008813135
Steps that I followed:
npm install --save @carbon/react
as well as Scss with npm install sass
App.css
and index.css
to .scss
and both of their contents are just @use "@carbon/react";
From what I've Googled it seems to be an error with finding the fonts, but the IBM docs also mention that I don't need to install the fonts separately as they're included with the React components.
Thanks in advance!
Ps. I'm usint Vite React TS
So I figured it out by finding a vite example on GitHub. The index.css
file needs to have the following contents:
@use '@carbon/react' with (
$font-path: '@ibm/plex'
);
and not what I had before which was simply:
@use '@carbon/react'