Entra una fuente, todas las fuentes web salen.
El propósito de esta herramienta es automatizar la generación de formatos de fuentes amigables con la web y las reglas CSS @font-face a partir de archivos de fuentes arbitrarios, sin tener que confiar en los servicios web o requerir una conexión de red. Esta herramienta puede generar URL de datos en línea si es necesario.
Consulte el artículo Uso de @Font-Face en CSS-tricks.com para obtener más información sobre cómo maximizar la compatibilidad de fuentes integradas.
./setup # Fetch and build third-party libraries
./bin/generate-webfonts MyFont.ttf -o assets/ # Convert a font El script del controlador se generate-webfonts . En su forma más básica, acepta un archivo de fuentes como argumento y escupe todas las fuentes convertidas a un directorio. También puede generar CSS para la regla apropiada @font-face también.
./bin/generate-webfonts -o assets MyFont.ttf --css MyFont.css
El comando anterior, que utiliza los formatos de salida predeterminados, genera los siguientes archivos:
MyFont.cssassets/MyFont.woffassets/MyFont.woff2assets/MyFont.ttfassets/MyFont.eotassets/MyFont.svg El archivo MyFont.css contendrá lo siguiente:
@font-face {
font-family : 'MyFont' ;
src : url ( 'assets/MyFont.eot' );
src : url ( 'assets/MyFont.eot?#iefix' ) format ( 'embedded-opentype' ) ,
url ( 'assets/MyFont.woff2' ) format ( 'woff2' ) ,
url ( 'assets/MyFont.woff' ) format ( 'woff' ) ,
url ( 'assets/MyFont.ttf' ) format ( 'truetype' ) ,
url ( 'assets/MyFont.svg#MyFont' ) format ( 'svg' );
}Conceptualmente, dada una lista de archivos de entrada y una lista de formatos de salida, el convertidor intentará satisfacer todos los requisitos de formato de salida copiando archivos de entrada coincidentes y convirtiendo archivos para completar los vacíos. Debido a las limitaciones en los convertidores de fuentes subyacentes, se pueden generar algunos formatos intermedios no solicitados.
El comando evitará generar un archivo en un determinado formato de salida si un archivo que coincide con ese formato ya está listado como una de las entradas. En este caso, el archivo de entrada simplemente se copiará en el directorio de destino (o se quedará solo, si ya está en el directorio de salida). Si dicho archivo no figura en los argumentos, se sobrescribirá con un archivo recientemente convertido, incluso si ya existe en el directorio de salida.
Vea las opciones a continuación para un uso más avanzado.
El script bin/generate-webfonts acepta una lista de archivos de fuentes como entrada y varias opciones:
-o --outputDirectorio de destino para archivos convertidos. Incluso si solo se generan fuentes en línea, se necesita un directorio de destino para contener archivos intermedios.
-f --formatLista de formatos de salida separada por comas. Los posibles formatos son:
Cualquier formato sufijo con :inline hará que la fuente se incluya en el archivo CSS como una URL de datos codificada por Base64, en lugar de una URL a un archivo.
La lista de formatos predeterminada es eot,woff2,woff,ttf,svg .
-c --css Ruta para el archivo CSS generado. Use - para stdout. Si se omite, no se genera CSS.
-p --prefix Prefijo de las rutas de fuentes utilizadas en el CSS generado. Por ejemplo, si su hoja de estilo se sirve de css/ y sus fuentes se sirven de fonts/ , entonces querrá establecer el prefijo en ../fonts/ . El prefijo predeterminado es el nombre del directorio de salida.
--font-familyNombre de la familia de fuentes utilizada en el archivo CSS. El valor predeterminado es el nombre base del primer archivo de entrada.
--verboseMostrar salida detallada mientras se ejecuta.
-v --versionVersión de visualización.
generate-webfonts admite los siguientes formatos de fuente:
Puede convertir hacia y desde cualquiera de los formatos enumerados anteriormente, con una excepción: no puede convertir EOT a otros formatos.
El generador aprovecha tres bibliotecas/herramientas de terceros para convertir fuentes. Dado que ninguna herramienta única admite todos los formatos de fuente, el trabajo del generador es descubrir una buena cadena de convertidores para usar para convertir entre dos formatos de fuentes. Debajo del capó, en realidad se implementa como un problema de ruta más corta en un gráfico de dependencia.
Las herramientas de terceros utilizadas son:
FontForge admite leer y generar un buen número de formatos de fuentes, aunque no tiene soporte para los formatos EOT o Woff2. La biblioteca SFNTLY rápida puede convertir las fuentes TTF en EOT o Woff, cubriendo uno de estos huecos. El convertidor WOFF2 de Google también se usa para convertir entre los formatos WOFF2 y TTF.
Como se mencionó anteriormente, ejecute ./setup para descargar y construir las bibliotecas de terceros. Ejecutando ./setup verificará los repositorios del convertidor SFNTLY y WOFF2 localmente donde generate-webfonts puede encontrarlos. Instale FontForge usando su Administrador de paquetes o directamente desde su sitio web.
El proceso de configuración asume un entorno *nix. Actualmente no hay soporte para configurar esta herramienta en Windows.
Se requieren los siguientes comandos para ejecutar el script de configuración:
gitjava y javacmvn (Maven) El script generate-webfonts en sí requiere Python 3.
¡Convierta de manera responsable! Respeta los derechos de autor de los creadores de fuentes.