Styles dans react-pdf montrant un comportement anormal

Question

J'essaie d'utiliser le style italique dans react-pdf.

Tout fonctionne bien jusqu'à ce que j'utilise font-style: italic; .

Existe-t-il un autre moyen de styliser le texte en italique dans react-pdf ?

const Italic = styled.Text`
  font-size: 12px;
  lineheight: 20px;
  text-align: left;
  font-family: "Roboto Condensed";
  letter-spacing: 0.5px;
  font-style: italic;//problem is with this line
  font-weight:400;
`;

Il me donne l'erreur :

Erreur involontaire (dans la promesse) : Impossible de résoudre la police pour undefined, fontWeight 400

Answer 1

Lorsque vous enregistrez vos fontes, vous devez vous assurer d'inclure une variante pour chaque fontStyle que vous souhaitez utiliser. Par exemple :

Font.register({
  family: 'Roboto',
  fonts: [
    { src: '<path-to-normal-font-variant>' },
    { src: '<path-to-italic-font-variant>', fontStyle: 'italic' },
    ...
  ]
});

Answer 2

const Italic = styled.Text`
  font-size: "12px";
  lineheight: "20px";
  text-align: left;
  font-family: "Roboto Condensed";
  letter-spacing: "0.5px";
  font-style: "italic";//problem is with this line
  font-weight:400;
`;

où que soit le suffixe px, il doit être entre guillemets simples ou doubles et font-style : value(italic) doit être entre guillemets doubles également.