javascript - new FontFace() doesn't work in create react app

Question

I wanna make a dynamic font loader

import './App.css';

function App() {

  const font = async () => {
    try {
      const font = new FontFace('ko', 'url(ko.ttf)');
      const loadedFont = await font.load();
      console.log(loadedFont);
    } catch (err) {
      console.error(err);
    }
  };

  return (
      <div className="App">
        <button onClick={font}>Click</button>
      </div>
  );
}

export default App;

I got an error when I click on the button

Failed to decode downloaded font: http://localhost:3001/ko.ttf
OTS parsing error: invalid version tag
DOMException: A network error occurred

It's too simple code.. what's wrong and how can i fix it

question from:https://stackoverflow.com/questions/65932322/new-fontface-doesnt-work-in-create-react-app

Answer 1

Waitting for answers