laravel-mixでコンパイルした場合に日本語フォント名がエスケープされて、Webフォントが使えなくなることがありましたが、laravel-mixのイベントフック(Event Hooks)を使ってコンパイル後にエスケープ前の変換して解決しました。(もうちょっとスマートにできないかなぁ。。悩み)

Webフォントのサービスは。REALTYPE(https://www.realtype.jp)
以下のように日本語だとOK

.hoge {
    font-family : 'A+mfCv-AXIS Font ベーシック UL ProN';
}

laravel-mixでsassコンパイルすると以下のようにエスケープされてNG

.hoge {
    font-family : 'A+mfCv-AXIS Font \30D9\30FC\30B7\30C3\30AF   UL ProN';
}

次のようにして解決

then()でコンパイル後のイベントをフックして読み込んで置換(split-join)して再度書き込んでます。


//元のフォント名  'A+mfCv-AXIS Font ベーシック UL ProN'
//エスケープされたフォント名  'A+mfCv-AXIS Font \\30D9\\30FC\\30B7\\30C3\\30AF   UL ProN'

mix
    .sass('style.sass', 'dist/css/')
    .then(() => {
        let css = fs.readFileSync('dist/css/style.css', {encoding: "utf-8"});
        css = css.split('\\30D9\\30FC\\30B7\\30C3\\30AF  ').join('ベーシック');
        fs.writeFileSync('dist/css/style.css', css);
    });

参考 : laravel-mix : EventHooiks
https://github.com/JeffreyWay/laravel-mix/blob/master/docs/event-hooks.md