A custom font file is provided as TTF file.
Ideally, the webpack setup in sage 9 converts the TTF file to WOFF format (which is supported by all browsers now) - and maybe WOFF2 (supported by many browsers with better compression).
Is there a webpack loader for this task and how can I integrate it into sage 9?
Perhaps this is a decent starting point (and some shameless self promotion): https://cfxdesign.com/css3-font-converter-is-a-command-line-font-face-converter/
1 Like
One of the dependencies of your workflow doesn’t seem to be available anymore: http://people.mozilla.org/~jkew/woff/ I found this, which seems to be the same thing, but it doesn’t look like it has any binaries: https://github.com/ppicazo/sfnt2woff Do you know if the binaries are still available somewhere?
1 Like
$ brew tap bramstein/webfonttools && brew install sfnt2woff
does that get you there?
2 Likes
Yes, works great! Thanks.
Sweet! Updated the post accordingly 
1 Like
How are you invoking this command in your sage 9 webpack based workflow?
What about a webpack loader for TTF fonts?
Are you also converting to woff2, some browsers support it and it got superior performance.
I’m not using this in my webpack workflow. Unless I was making changes to the font files themselves as part of development (I’m not) there’s no need to regenerate font files all the time. When I’ve needed to convert fonts (using this technique or another), I just put the converted assets into my theme’s assets folder and use those. Regenerating them with every yarn build would just lengthen my build process for no real benefit I can see.
1 Like
Ideally webpack would detect changes source files and otherwise skip/cache them.
I plan to use a postCSS plugin for the font family: