Primeros pasos con Gatsby: cuando agrego una etiqueta de enlace a public/index.html con la fuente de Google, funciona en modo de desarrollo. Cuando construyo el sitio, index.html se reinicia. Entonces, ¿supongo que hay otra forma adecuada de agregar la fuente?
También puede usar react-helmet , que se analiza en el tutorial de gatsby .
Incluya un elemento de enlace de fuentes de Google dentro del componente del casco.
Me gusta esto:
<Helmet> <link href="https://fonts.googleapis.com/css?family=Open+Sans" rel="stylesheet"/> </Helmet>Terminé siguiendo esta ruta porque ya había hecho algo de estilo manualmente, y cuando intenté usar Typography, hice un montón de cambios que me habría llevado un tiempo deshacer.
Agregue lo siguiente en la parte superior de src/layouts/index.css por ejemplo, para importar la fuente 'Roboto' de Google
@import url('https://fonts.googleapis.com/css?family=Roboto'); html { font-family: 'Roboto', sans-serif; }Luego, esto será manejado por el proceso de construcción de Gatsby e incluido en la versión de producción final del sitio.