React下styled-componentsで外部フォント@font-faceを使用

私の処女作「Canvasシリーズチュートリアル」は私のGithubで連載中で更新されています.あなたの注目と支持を得て、私にもっと多くの動力を創作させたいと思っています.
チュートリアル紹介、チュートリアルカタログなどはREADMEで閲覧できます.
転送ゲート:https://github.com/827652549/CanvasStudy
styled-componentsでは、逆一重引用符にパスを書くことはできません.

import styled from 'styled-components';

export const Style=styled.span`
    
  @font-face{
               font-family:'hkww';
               src:url('../../../static/font/hkwwW5.TTF') format('TrueType');   

      }

`;

ヘッダで参照するには有効です

import styled from 'styled-components';
import MyFont from '../../../static/font/hkwwW5.TTF';
export const Style=styled.span`
    
  @font-face{
               font-family:'hkww';
               src:url('${MyFont}') format('TrueType');   

      }

`;